最近在看《Javascript高级程序设计》的时候,看到了这样一句话:“理解NodeList和HTMLCollection,是从整体上透彻理解DOM的关键所在。”,所以觉得应该写一篇关于NodeList和HTMLCollection的博客来 ...
最近在看《Javascript高级程序设计》的时候,看到了这样一句话:“理解NodeList和HTMLCollection,是从整体上透彻理解DOM的关键所在。”,所以觉得应该写一篇关于NodeList和HTMLCollection的博客来好好了解和总结下这方面的知识点。
NodeList
NodeList是一个节点的集合(既可以包含元素和其他节点),在DOM中,节点的类型总共有12种,通过判断节点的nodeType来判断节点的类型。
我们可以通过Node.childNodes和document.querySelectAll() (返回NodeList的接口有很多,这里不一一列举,下同)来获取到一个NodeList对象。
NodeList对象有个length属性和item()方法,length表示所获得的NodeList对象的节点个数,这里还是要强调的是节点,而item()可以传入一个索引来访问Nodelist中相应索引的元素。
1 <body> 2 <div id="node"> 3 文本节点 4 <!-- 注释节点 --> 5 <span>node1</span> 6 <span>node2</span> 7 <span>node3</span> 8 </div> 9 </body>10 <script>11 var node = document.getElementById('node'),12 nodeLists = node.childNodes13 console.log(nodeLists.length) // 输出为914 </script>
原标题:DOM中的NodeList与HTMLCollection
关键词:HTML
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。