您的位置：首页 > Web前端

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

2016-11-18 10:45 519 查看

昨天在看视频的时候，发现有个老师说了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>

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

经过IE11浏览器的仿真测试，发现连IE5这种老古董都会弹出“我是p2”的框框.

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： web前端兼容性 getElement

相关文章推荐

新的分享

章节导航