DOM 树上的选择与遍历
选择器 API 提供了方法，可以根据一组 选择器 快速轻松地从 DOM 中检索 Element 节点。这比过去的技术要快得多，例如，过去需要使用 JavaScript 代码中的循环来查找您需要找到的特定项。
NodeSelector 接口
此规范向实现 Document、DocumentFragment 或 Element 接口的任何对象添加了两个新方法
querySelector()-
返回节点子树中第一个匹配的
Element节点。如果没有找到匹配的节点，则返回null。 querySelectorAll()-
返回一个包含节点子树中所有匹配的
Element节点的NodeList，如果没有找到匹配项，则返回一个空的NodeList。
注意： querySelectorAll() 返回的 NodeList 不是实时的，这意味着 DOM 的更改不会反映在该集合中。这与其他返回实时节点列表的 DOM 查询方法不同。
您可以通过阅读 Element.querySelector() 和 Element.querySelectorAll() 方法的文档来查找示例和详细信息。
选择器
选择器方法接受 选择器 来确定应返回哪个或哪些元素。这包括 选择器列表，因此您可以在单个查询中组合多个选择器。
为了保护用户隐私，某些 伪类 不受支持或行为不同。例如，:visited 将不返回任何匹配项，而 :link 被视为 :any-link。
只能选择元素，因此 伪类 不受支持。
示例
要选择文档中所有包含 warning 或 note 类的段落 (p) 元素，您可以执行以下操作
js
const special = document.querySelectorAll("p.warning, p.note");
您也可以按 ID 查询。例如
js
const el = document.querySelector("#main, #basic, #exclamation");
执行上述代码后，el 包含文档中 ID 为 main、basic 或 exclamation 的第一个元素。