解决getElementsByClassName在IE8之前无法使用的问题

最新推荐文章于 2021-07-08 11:01:25 发布

闪现A小兵

最新推荐文章于 2021-07-08 11:01:25 发布

阅读量3.2k

点赞数

分类专栏：兼容性文章标签： web前端兼容性 getElement

本文链接：https://blog.csdn.net/moguzhale/article/details/53213702

版权

兼容性专栏收录该内容

3 篇文章 0 订阅

订阅专栏

昨天在看视频的时候，发现有个老师说了getElementsByClassName这个功能在IE10之前的浏览器中是无法使用的，之前我一直不知道，原来这种属性都是有兼容性问题的。于是，带着疑惑，我尝试了一下，因为我的电脑不知道为什么IETester 装好以后用不了，所以我是在IE浏览器的仿真测试中运行。我的IE版本是11.结果发现是IE8及其之前的浏览器不能运行：我的测试测试代码如下:

----------------------------------------------------------------------------

<body>
<p class="p1">我是p1</p>
<p class="p1">我是p2</p>
<p class="p1">我是p3</p>
<script>
var x=document.getElementsByClassName("p1");
alert(x[1].innerHTML);
</script>

----------------------------------------------------------------------------

后来在听了视频中老师的方法以后，知道了解决这个问题的方法，那就是我们自己封装一个兼容各个浏览器的函数,整理后代码如下:

----------------------------------------------------------------------------

<body>
<p class="p1">我是p1</p>
<p class="p1">我是p2</p>
<p class="p1">我是p3</p>
<script>
function getClassName(clsName,parent){
var oParent=document.getElementById(parent)||document;
var elements=oParent.getElementsByTagName("*");
var ele=[];
for(var i=0;i<elements.length;i++){
if(elements[i].className==clsName){
ele.push(elements[i]);
}
}
return ele;
}
alert(getClassName("p1")[1].innerHTML);
</script>
</body>