getElementsByClassName兼容 封装
Posted huzhuhua
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了getElementsByClassName兼容 封装相关的知识，希望对你有一定的参考价值。
众所周知，JS获取DOM有个getElementsByClassName，非常方便，但是呢，为了兼容某些浏览器(你懂的)。只能 进行封装下了。解决方法如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>getElementsByClassName 封装</title> </head> <body> <div class="item">item1</div> <div class="item">item2</div> <div class="item">item3</div> <div class="item">item4</div> <div class="item">item5</div> <div class="item">item6</div> </body> <script> function getElementsByClassName(name, attrbuteName) var arr = []; if (document.getElementsByClassName) // 如果支持这个属性，直接获取 arr = document.getElementsByClassName(name) else // 如果 不支持 var attr = attrbuteName ? attrbuteName : "*";///如果指定标签名称则用 var tagNameArr = document.getElementsByTagName(attr); for (var index = 0; index < tagNameArr.length; index++) var classNameArr = tagNameArr[index].className.split(" ") for (var j = 0; j < classNameArr.length; j++) if (classNameArr[j] === name) arr.push( tagNameArr[index]) return arr; getElementsByClassName("item","div")[0].style.color = "red" </script> </html>
以上是关于getElementsByClassName兼容 封装的主要内容，如果未能解决你的问题，请参考以下文章