描述你的问题
想写JavaScript原生获取元素节点,兼容IE低版本浏览器。但是IE7中无法识别ul标签下的li标签之后的span和a标签。也就是HTML中注释的部分。-
贴上相关代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>获取元素子节点-兼容低版本浏览器</title> <script> window.onload=function(){ var oUl=document.getElementById("ul1"); var oDiv=document.getElementById("div1"); function getEleChild(ele){ var eleChildArr=ele.children || ele.childNodes; var childArrTmp=[]; for(var i=0;i<eleChildArr.length;i++){ if(eleChildArr[i].nodeType==1){ childArrTmp.push(eleChildArr[i]); } } return childArrTmp; } console.log(getEleChild(oDiv)); console.log(getEleChild(oUl)); alert(getEleChild(oDiv).length); alert(getEleChild(oUl).length); } </script> </head> <body> <div id="div1"> <ul> <li></li> <li></li> <li></li> </ul> <p></p> <span></span> <a href="#">链接</a> <a href="#">点击</a> <input type="text" /> 1111 </div> <ul id="ul1"> <a href="#">li之前的a标签</a> <span>li之前的span标签</span> <li></li> <li></li> <span>li之前的span标签</span><!-- IE7下无法识别这个span标签,不知道为啥 --> <li></li> <span>li之后的span标签</span><!-- IE7下无法识别这个span标签,不知道为啥 --> <a href="#">li之后的a标签</a><!-- IE7下无法识别这个a标签,不知道为啥 --> 2222 </ul> </body>
</html>
贴上报错信息
执行代码后,谷歌和火狐浏览器、IE8及以上依次弹出6,8.但IE7下,却弹出6,5.没能识别到li之后的span标签和a标签。贴上相关截图
望解答,谢谢~
ie7- 会把位于li元素之后的元素修复到其前面最近的li元素内,成为该li元素的子元素。
IE6 IE7 IE8(Q) 会忽略 LI DD DT 元素的结束标记