假设我在一个页面上有多个元素,每个元素都有一个或多个类名,例如:
<div class="A1 A2 B1">…</div>
<div class="A2 C3">…</div>
<div class="B2 C3">…</div>
etc.
有没有办法选择,例如,所有具有
的元素class = (A1 OR A2) AND (B1 OR B2)
?
最佳答案
您可以将 css 选择器与 querySelectorAll
函数一起使用。
(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
关于javascript - Javascript 有没有办法选择与多个类名的 bool 表达式匹配的元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58105725/