[dom] children属性的陷阱

  children是个好属性,通过这个属性取得的节点不饱和文本节点,如果使用childNodes的话会包括文本节点。这个属性首先有ie进入,现在已经跨浏览器。使用他可以减少我们过滤节点的操作。

兼容情况见http://www.quirksmode.org/dom/w3c_core.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" lang="en">
<head>
<title></title>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<!-- xxx -->
</ul>
<script type="text/javascript">
(function(window,doc,undefined){
var childs=doc.getElementsByTagName('ul')[0].children;
console.log(childs.length);
})(window,document)
</script>
</body>
</html>
复制代码



如果使用这段代码的话,大部分浏览器返回的节点数都是6

 

 

这次中枪的是ie8,

 

ie8会把注释节点也算做有效节点,这个问题只出现ie8上,所以要使用这个属性要记得过滤文本节点。ppk的站点上也特别说明了这点。

posted @   小玉西瓜  阅读(394)  评论(0编辑  收藏  举报
编辑推荐:
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
阅读排行:
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(三):用.NET IoT库
· 【非技术】说说2024年我都干了些啥
点击右上角即可分享
微信分享提示