在 Javascript 到 select 元素中是否有办法匹配多个 ZA2F2ED4F8EBC2CBB14C21A29ZD 名称的 boolean 表达式？

Question

假设我在一个页面上有多个元素，每个元素都有一个或多个 class 名称，例如：

<div class="A1 A2 B1">…</div>
<div class="A2 C3">…</div>
<div class="B2 C3">…</div>
etc.

有没有办法select，例如，所有元素都有

class = (A1 OR A2) AND (B1 OR B2) 

?

Answer 1

您可以将 css 选择器与querySelectorAll function 一起使用。

(A1 OR A2) AND (B1 OR B2)与说(A1 AND B1) OR (A1 AND B2) OR (A2 AND B1) OR (A2 AND B2)相同，我们可以使用像这样的 css 选择器来表达.A1.B1, .A1.B2, .A2.B1, .A2.B2 。

 // (A1 OR A2) AND (B1 OR B2) const selector = '.A1.B1, .A1.B2, .A2.B1, .A2.B2'; const $elems = document.querySelectorAll(selector); $elems.forEach($el => console.log($el));

 <div class="A1 A2 B1"></div> <div class="A1 B1"></div> <div class="A1 B2"></div> <div class="A2 B1"></div> <div class="A2 B2"></div> <div class="A2 C3"></div> <div class="B2 C3"></div>

• 更多关于 CSS 选择器： https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Selectors
• 有关 querySelectorAll 的更多信息：https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll