javascript - 如何使用 JavaScript 获取此 CSS 元素(.questions 标签 :before)?

Question

在 CSS 文件中，我有以下代码。

.questions label:before {
content: attr(letter);
display: inline-block;
color: gray;
}

仅使用 JavaScript(不首选 jQuery)，我想对此 CSS 元素进行一些更改，例如将颜色设为白色而不是灰色。

如果我们只处理像 .questions 这样的类名，我们可以做类似 document.getElementsByClassName("questions").style.color = "white"; 但我想使用 JavaScript 选择整个 .questions label:before。

Answer 1

您可以简单地用另一个覆盖它而不是更改 CSS，因为您不能使用 JS/jQuery 操作伪元素，因为它们不是 DOM 的一部分，您可以在这里阅读:https://stackoverflow.com/a/21709814/8620333

document.querySelector('.questions label').classList.add('newclass');

.questions label:before {
  content: attr(letter);
  display: inline-block;
  color: gray;
}

label.newclass:before {
  color: red;
}

<div class="questions">
  <label letter="content ">text text</label>
</div>