如何获取页面上除div之外的所有元素[重复]答案

【问题标题】：How to get all elements on a page except div's [duplicate]如何获取页面上除div之外的所有元素[重复]
【发布时间】：2021-09-15 09:20:13
【问题描述】：

所以我试图将一些 css 应用到页面上的每个元素，但我不希望 css 应用到 div。我目前正在使用document.getElementsByTagName("*") 来选择每个元素，但据我所知，无论如何都没有过滤掉某种元素类型。我想我找到了一些我想要的代码，但它使用的是 jQuery，我不想在这个项目中使用它。有人知道怎么做吗？

【问题讨论】：

欢迎来到 Stack Overflow！请访问help center，以tour 了解内容和How to Ask。做一些研究，搜索关于SO的相关主题；如果您遇到困难，请发布您尝试的minimal reproducible example，注意输入和预期输出，最好在Stacksnippet

标签： javascript web dom google-chrome-extension browser

【解决方案1】：

您可以使用下面的选择器来选择 body 的所有子元素，而不是 div

body *:not(div)

或

body :not(div)

const allExceptDiv = document.querySelectorAll("body *:not(div)");

allExceptDiv.forEach(el => el.classList.add("highlight"))

.highlight {
  background: yellowgreen;
}

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
</ul>

<div>This is div</div>

<p> This is para </p>

【讨论】：

【解决方案2】：

你可以使用非选择器

 body :not(div) {
     color: red;
 }

<html><body>
<div>Hello</div>
<a>World</a>
</body></html>

记得包含body，否则body 也将被视为应具有color: red 样式的元素。

参考：
https://developer.mozilla.org/en-US/docs/Web/CSS/:not

【讨论】：