9

我想知道这个话题很长一段时间。有问题的方法如下：

  • getElementsByTagName
  • getElementsByClassName
  • getElementsByName
  • querySelectorAll

据我所知，这些 DOM 方法是唯一能够返回 freeze 或 live 的方法NodeLists。对于其中一些方法，顺序由W3C 规范定义。例如，http://www.w3.orgNodeLists为返回的内容编写了以下内容querySelectorAll

Document、DocumentFragment 和 Element 接口上的 querySelectorAll() 方法必须返回一个 NodeList，其中包含上下文节点的子树中所有匹配的 Element 节点，按文档顺序排列。如果没有匹配的节点，该方法必须返回一个空的 NodeList。

但是，对于我提到的其他方法，我找不到类似的明确规范。我的问题是：

  • 结果是否有定义的顺序（很可能是文档顺序）？
  • 这些规范有多可靠和跨浏览器实现？

绝对清楚：

<div>this</div>
<div>is</div>
<div>a demo</div>

// is this always guaranteed to be "<div>is</div>"
document.querySelectorAll('div')[1]
4

1 回答 1

7

是的。所有这些都按文档顺序/树顺序。

  • getElementsByName( DOM Level-2-HTML ) 返回一个NodeList
  • querySelectorAll（选择器 API）返回NodeList“按文档顺序”
  • getElementsByTagName( DOM ) 返回一个HTMLCollection
  • getElementsByClassName( DOM ) 返回一个HTMLCollection

HTMLCollections和NodeLists都被指定为

元素按树顺序排序。

当通过 indizes 访问它们时。

我认为所有浏览器都可靠地实现了这些规范（即使链接的版本可能比某些实现更新），主要是因为树顺序是最合乎逻辑且易于编码的一种。但是，您可能需要注意某些浏览器可能会返回由不同元素组成的列表，因为它们的节点匹配不同。name在确定一个元素的时候，我会想到一些怪癖。

于 2012-10-27T18:09:42.340 回答