css - 选择具有某种颜色的所有元素？

Question

是否有可以选择具有某种颜色的所有元素的选择器？我想用 to 更改所有color: #1a0dab文本color:00b0f4。

Answer 1

Javascript/jQuery 中没有这样的选择器。也许您可以： 1 - 更新 CSS 文件并查找/替换所有实例 2 - 为所有必需元素添加一个类，然后使用该类来定位它们。

Answer 2

如果样式是内联定义的，您可以这样做：

[style*="#1a0dab"] {
    color: #00b0f4 !important;
}

演示：

[style*="#1a0dab"] {
    color: #00b0f4 !important;
}

<p style="color: #1a0dab">paragraph 1</p>

<p>paragraph 2</p>

<p style="color: #1a0dab">paragraph 3</p>

如果原始样式未内联定义，则没有纯 CSS 方式来执行此操作。

如果您可以访问 JavaScript，则可以执行以下操作，但如果您的页面有很多元素或者您需要经常运行该函数，则性能可能会很差：

[...document.querySelectorAll('*')]
    .filter(el => getComputedStyle(el).color === 'rgb(26, 13, 171)')

请注意，您需要使用 RGB 表示，而不是十六进制版本来检查相等性。

这是后一种方法的演示：

[...document.querySelectorAll('*')]
    .filter(el => getComputedStyle(el).color === 'rgb(26, 13, 171)')
    .forEach(el => el.style.color = '#00b0f4')

.has-color {
    color: #1a0dab;
}

<p class="has-color">paragraph 1</p>

<p>paragraph 2</p>

<p class="has-color">paragraph 3</p>

Answer 3

您应该列出您需要更改颜色的所有标签，然后使用 jquery 给出唯一的颜色更改顺序