脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-js便签笔记（1）――说说HTMLCollection、NodeList以及NamedNodeMap，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。 介绍
在js的dom操作中，除了常用的document、htML**Element之外，还有三个集合对象，即@L_406_0@Collection、nodelist以及NamedNodeMap。试看以下操作：
复制代码
1 VAR ps = document.getelementsbytagname("p");
2 alert(ps instanceof HTMLCollection); //true （chrome中返回false，ps是NodeList对象）
3
4 var p = document.getElementById("p1");
5
6 var children = p.childNodes; //获取p元素子节点集合
7 alert(children instanceof NodeList); //true
8
9 var attrs = p.attributes; //获取p元素的特性
10 alert(children instanceof NamedNodeMap); //true
复制代码
以上代码中，chrome下的document.getElementsByTagName("p")将返回NodeList对象。
这三个对象都是“类数组”，可以获取他们的length，也可以通过 attrs[0] 获取数据，有点类似与函数里面的arguments。
NamedNodeMap和Attr
p.attrbutes将返回一个NamedNodeMap对象，即NamedNodeMap存储是的p的“特性Attribute”集合。而集合中的每一个元素，都是Attr类型的对象。Attr对象有三个属性，name、value和sPEcified。
但是在日常应用中，一般会应用getAttribute()、setattribute()和romoveAttribute()来操作特性，不需要直接访问特性对象。
另外，dom元素的“特性”（Attribute）和“属性”（PRoperty）是不一样的，两者要分清楚，我会在以后的文章中专门讲解。
所谓“动态”
HTMLCollection、NodeList以及NamedNodeMap这三个集合都是“动态的”，每当文档发生变化时，他们都会更新。他们将始终保持这最新、最准确的消息。且看以下程序：
复制代码
var ps = document.getElementsByTagName("p"),
i,
p;
for (i = 0; i < ps.length; i++) {
p = document.createElement("p");
document.body.appendChild(p);
}
复制代码
以上代码是个死循环！
为何？就因为ps是通过getElementsByTagName()获取的htmlCollection集合，它是“动态”的。每次执行document.body.appendChild(p)时候，ps.length都会增加。
总结
1. 要了解 HTMLCollection、NodeList以及NamedNodeMap 三种集合类型；
2. 他们都是“类数组”；
4. 特性和属性不同，后续会专门讲解。
觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！
以上是脚本宝典为你收集整理的javascript代码实例教程-js便签笔记（1）――说说HTMLCollection、NodeList以及NamedNodeMap全部内容，希望文章能够帮你解决javascript代码实例教程-js便签笔记（1）――说说HTMLCollection、NodeList以及NamedNodeMap所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。