浏览器的dom兼容

使用childNodes来遍历dom元素子节点

<ul>
    <li>123</li>
    <li>123</li>
    <li>123</li>
</ul>

对于上面一段代码,如果IE来解析,<ul>元素会有3个子节点,就是3个<li>。对于其他浏览器,则会解析出7个元素,3个<li>和4个文本节点。

<ul><li>123</li><li>123</li><li>123</li></ul>

如果将空白符删除,那么所有浏览器都会返回3个子节点。

如果需要使用childNodes来遍历dom元素子节点,需要先检查一下元素的nodeType属性。

for(let i = 0,len = element.childNodes.length; i<len; i++){
  if(element.childNodes[i].nodeType == 1){
    //...
  }
}

常见dom类型的nodeType:

domType nodeType
Element 1
Attr 2
Text 3
Comment 8
Document 9
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容