DOM中NodeList&NamedNodeMap&am

2017-11-09  本文已影响7人  刘翾

NodeList

每个节点都有一个childNodes属性, 其中保存这一个NodeList对象. NodeList是一种类数组对象, 用于保存一组有序的节点, 可以通过位置来访问这些节点. NodeList对象的独特之处在于, 它实际上是基于DOM结构动态执行查询的结果, 因此DOM结构的变化能够自动反映在NodeList中. NodeList是"动态的":

var arrayOfNodes = Array.prototype.slice.call(someNode.childNodes, 0);//可以用于将NodeList转换化为真正的数组

NamedNodeMap

与NodeList类似, 也是一个"动态"的集合. 元素的特性都由一个Attr节点表示, 每一个节点都保存在NamedNodeMap对象中. NamedNodeMap对象有下列方法.

名称 功能
getNamedItem(name) 返回nodeName属性等于name的节点
removeNamedItem(name) 从列表中移除nodeName属性等于name的节点
setNamedItem(node) 向列表中添加节点, 以节点的nodeName属性为索引
item(pos) 返回位于数字pos位置处的节点
//例
var id = element.attributes.getNamedItem('id').nodeValue;
//或者
var id = element.attributes["id"].nodeValue;

HTMLCollection

一种常用于取得元素引用的方法是getElementsByTagName( ). 即要取得元素的标签名, 而返回的是包含零或者多个元素的NodeList. 在HTML文档中, 这个方法会返回一个HTMLCollection对象, 作为一个"动态"集合, 该对象与NodeList非常类似.

//例: 会取得页面中所有的<img>元素, 并返回一个HTMLCollection.
var image = document.getElementsByTagName("img");
名称 功能
item()或者方括号 访问HTMLCollection对象中的项
namedItem() 使用这个方法可以通过元素的name特性取得集合中的项

一些方法

名称 功能
item()或者方括号 访问HTMLCollection对象中的项
namedItem() 使用这个方法可以通过元素的name特性取得集合中的项
<img src="ss,gif" name="myImage">
//例如刚刚的image
var myImage = image.namedItem("myImage");
//会返回第一行的标签
上一篇 下一篇

猜你喜欢

热点阅读