如何在querySelectorAll()中排除特定的类名？

Question

如何排除具有特定类名的标记元素？

<span class="test" />
<span class="test asd" />

document.querySelectorAll('span.test'); //how to exclude all spans with "asd" as class name?

Answer 1

使用:notCSS伪类:

document.querySelectorAll('span.test:not(.asd)');

Answer 2

document.querySelectorAll('span.test:not(.asd)');

否定伪类:not(X)是一个函数符号,它将一个简单的选择器(不包括否定伪类本身)作为参数.它表示一个未由其参数表示的元素.

如果`.asd` 是父类怎么办？例如，如果我们需要选择一些类为 `.bbb` 而在某些父类中没有 `.asd` 的元素？可以这样使用 `:not()` 吗？或者我们应该首先选择所有类为 `.test` 而没有类为 `.asd` 的元素，然后以某种方式从生成的 NodeList 元素中提取类为 `.bbb` 的元素？如果是，那又如何？:) (2认同)

Answer 3

按 tagName 的元素并忽略或排除具有特定类的元素：

document.querySelectorAll(`svg,div:not([class*="background"]`)