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