当前位置首页 > 百科> 正文

nodelist

2019-08-08 08:15:07 百科
nodelist

nodelist

NodeList实例对象是一个类似数组的对象,它的成员是节点对象。Node.childNodes、document.querySelectorAll()返回的都是NodeList实例对象。NodeList 对象代表一个有序的节点列表。

基本介绍

  • 中文名:节点列表
  • 外文名:NodeList

正文

NodeList 对象

节点列表中的节点可以通过其对应的索引数字(从 0 开始计数)进行访问。
节点列表可保持其自身的更新。如果节点列表或 XML 文档中的某个元素被删除或添加,列表也会被自动更新。
注意:在一个节点列表中,节点被返回的顺序与它们在 XML 文档中被规定的顺序相同。

NodeList 对象属性

属性描述
length
返回节点列表中的节点数量。

NodeList 对象方法

方法描述
item()
返回节点列表中指定索引号的节点。

实例

实例1:
var parent = document.getElementById('parent');parent.childNodes.length // 2parent.appendChild(document.createElement('div'));parent.childNodes.length // 3
NodeList实例对象可能是动态集合,也可能是静态集合。所谓动态集合就是一个活的集合,DOM树删除或新增一个相关节点,都会立刻反映在NodeList接口之中。
上面代码中,parent.childNodes返回的是一个NodeList实例对象。当parent节点新增一个子节点以后,该对象的成员个数就增加了1。Node.childNodes返回的是一个动态集合。
document.querySelectorAll方法返回的是一个静态集合。DOM内部的变化,并不会实时反映在该方法的返回结果之中。
NodeList接口实例对象提供length属性和数字索引,因此可以像数组那样,使用数字索引取出每个节点,但是它本身并不是数组,不能使用pop或push之类数组特有的方法。
实例2:
//HTML部分代码//<ul><li>one</li><li>two</li><li>three</li></ul>//JAVASCRIPT代码var myNodeList = document.querySelector('ul').childNodes;for(var i=0;i<myNodeList.length;i++){    console.log(myNodeList[i]);}/* <li>one</li><li>two</li><li>three</li>*/console.log(myNodeList.length);// 3console.log(myNodeList.item(1));//<li>two</li>
在上面代码中,通过for循环遍历了myNodeList的数字索引部分,返回了3个索引对应的成员,并且正确返回了length属性为3。
通过item()方法访问了myNodeList实例对象的第二个成员。由于数字索引从零开始计数,所以取出第二个成员,要使用数字索引1。
所有类似数组的对象,都可以使用方括弧运算符取出成员,所以一般情况下,都是使用NodeList[index]方法,而不使用item方法。
声明:此文信息来源于网络,登载此文只为提供信息参考,并不用于任何商业目的。如有侵权,请及时联系我们:baisebaisebaise@yeah.net