JS DOM HTMLCollection 对象

HTMLCollection对象

HTMLCollection对象表示元素(按文档顺序)的通用集合(类似数组的对象,类似于参数),并提供用于从列表中进行选择的方法和属性。

HTML DOM中的HTMLCollection是实时的;当基础文档更改时,它会自动更新。

诸如getElementsByTagName()之类的方法将返回HTMLCollection。

HTMLCollection属性和方法

下表列出了HTMLCollection对象的属性和方法:

属性/方法描述
item()返回HTMLCollection中指定索引处的元素
length返回HTMLCollection中的元素数
namedItem()返回HTMLCollection中具有指定ID或名称的元素

示例

此示例返回一个HTMLCollection:

// 返回所有<p>的集合文档中的元素
var x = document.getElementsByTagName("p");
测试看看

更改此文档的第一个<p>元素的HTML内容:

var x = document.getElementsByTagName("p");
x.item(0).innerHTML = "HELLO WORLD";
测试看看

找出文档中有多少<p>个元素:

var len = document.getElementsByTagName("p").length;
测试看看

获取ID为“ demo”的<p>元素的内容:

var x = document.getElementsByTagName("p").namedItem("demo");
document.getElementById("output").innerHTML = x.innerHTML;
测试看看

也可以使用简写方法,它将产生相同的结果:

var x = document.getElementsByTagName("p")["demo"];
document.getElementById("output").innerHTML = x.innerHTML;
测试看看