通过调用document.getElementsByTagName, document.getElementsByName以及document.getElementsByClassName(部分浏览器不支持),可以返回HTMLCollection对象。表面上,它们与数组很类似,因为它们都包含length属性并且元素都可以通过[index]方式访问。然而,实际上它们并不是数组;诸如push(), slice()与sort()之类的方法不受支持。
考虑下面的HTML文档:
<body>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
<p>Paragraph 3</p>
</body>
我们使用原生JavaScript的getElementsByTagName方法与jQuery选择器分别获取每一个paragraph节点:
var pCollection = document.getElementsByTagName("p");
var pQuery = $("p");
console.log("pCollection.length: ", pCollection.length);
console.log("pQuery.length: ", pQuery.length);
它们都返回了相同的节点,因此集合长度都是3:
pCollection.length: 3 pQuery.length: 3
我们现在再向文档中添加一个paragraph元素,然后再观察一下集合:
// add new paragraph
var newp = ...