使用querySelectorAll().订购的方法返回的结果是?

bru*_*ais 32 javascript css css-selectors selectors-api

我正在尝试制作一个适用于多个页面的js代码.我正在尝试使用querySelectorAll()从DOM中获取元素.

我需要订购的元素.为了做到这一点,我可以使用xPath或选择器(我更喜欢使用选择器,但xPath也可以).问题是:
querySelectorAll()返回的NodeList中的元素是否按照标记在HTML中出现的顺序排序?

注意:我想添加标签:querySelectorAll

Rob*_*b W 44

返回的节点列表已订购.快速测试证明了这一点:

document.querySelectorAll("body, head")[0]; //Returned [object HTMLHeadElement]
Run Code Online (Sandbox Code Playgroud)

显然,<head>标签出现<body>在HTML文档之前.<head>即使选择器显示body在head之前,NodeList的第一个元素也是一个元素.

来自http://www.w3.org/TR/selectors-api/#queryselectorall:

所述querySelectorAll()的NodeSelector接口方法必须,当被调用时,则返回包含所有节点的子树中的匹配元素节点的NodeList,文档顺序.如果没有此类节点,则该方法必须返回空NodeList.

  • @brunoais Google搜索提示:如果您正在寻找官方规范,请在搜索查询中添加"w3 spec",如果您正在寻找有关CSS/JavaScript/HTML /的可靠来源,请添加"mdn" (6认同)
  • +1,但我会首先从规范中移走引用,因为一个浏览器实现一次按文档顺序返回结果这一事实并不能证明太多。 (5认同)
  • @capr“术语**文档顺序**意味着对相关 DOM 树或子树进行深度优先的前序遍历” - https://www.w3.org/TR/selectors-api/#document-order (4认同)
  • 那是一个 CSS 选择器。用“,”分隔并不意味着任何顺序(该部分位于规范中关于选择器如何选择的部分) (3认同)
  • 我已经测试过firefox,chrome和Opera.所有这些都显示它们有序,但我只是想知道是否在所有浏览器中都发生了这种情况. (2认同)