通过 CSS 选择器选择元素

document.querySelectorAll() 返回基于 CSS 选择器字符串的 DOM 元素列表（NodeList）。

以下代码返回文档中的所有 <div> 元素

var divs = document.querySelectorAll('div');Code language: JavaScript (javascript)

以下代码返回所有具有类 error 或 warning 的 <div> 元素

let divs = document.querySelectorAll("div.error, div.warning");Code language: JavaScript (javascript)

查看以下 HTML 片段

<div id="container">
   <p class="note">This is a note</p>
   <p class="note">This is another note</p>
   <p class="error">An error message</p>
<div>Code language: HTML, XML (xml)

以下代码获取 p 元素列表，这些元素的类为 note，位于 id 为 container 的另一个 div 内。

let container = document.querySelector("#container");
let matches = container.querySelectorAll("p.note");Code language: JavaScript (javascript)

找到匹配项后，您可以像处理数组一样处理它。如果数组为空，则表示没有找到匹配项。

以下代码删除在前面示例中找到的所有具有类 note 的 <p> 元素

matches.forEach(function(match) {
  match.parentNode.removeChild(match);
});Code language: PHP (php)