jquery 更改所有元素的颜色

hpxqektj 于 2023-08-04 发布在 jQuery

关注(0)|答案(2)|浏览(96)

我希望改变一个网站的'口音'的颜色。有没有人知道一个有效的方法来改变背景色，颜色和边界颜色的所有元素的颜色'洋红色'的例子？有没有一种方法可以检测CSS文件中的洋红色属性，并将其替换为另一种颜色？我正在为一个网站建立一个扩展（并且不希望添加大量的CSS文件和颜色更改），并且不能更改网站的源代码。
如果有什么不清楚的地方，请随时询问。

jquery

来源：https://stackoverflow.com/questions/32815120/change-the-color-of-all-elements

2条答案

按热度按时间

62lalag41#

你可以做这样的事。循环遍历所有元素，如果计算出的颜色是洋红色，则在元素上设置新颜色。

const magenta = 'rgb(255, 0, 255)';
const green = 'rgb(0, 255, 0)';

const getValue = (elem, property) => 
    window.getComputedStyle(elem, null)
        .getPropertyValue(property);

const changeColors = () =>
    document.querySelectorAll('*').forEach((elem) => {
        const backgroundColor = getValue(elem, 'background-color');
        const borderColor = getValue(elem, 'border-color');
        const color = getValue(elem, 'color');

        if (backgroundColor === magenta) {
            elem.style.backgroundColor = green;
        }

        if (borderColor === magenta) {
            elem.style.borderColor = green;
        }

        if (color === magenta) {
            elem.style.color = green;
        }    
    });

.background {
    background-color: magenta;
}
.color {
    color: magenta;
}
.border {
    border: solid 2px magenta;
}

<body>
    <div class="background">Background</div>
    <div class="color">Text</div>
    <div class="border">Border</div>
    <button onclick="changeColors()">Change Colors</button>
</body>

我不建议这样做，如果有任何其他的选择。预先更改CSS将是理想的，而不是使用JS。

赞(0）回复(0）举报 2023-08-04

nwlqm0z12#

可以使用jQuery**.css()**方法更改多个css属性：

$(".yourCssSelector").css({
    "background-color": "magenta",
    "color": "#00FF00",
    "border-color": "blue"
});

字符串
使用vanilla JS：

// choose an element using any of these:
var elem = document.getElementById('your-id');
var elem = document.getElementsByClassName('your-class-name')[0];
var elem = document.getElementsByTagName('div')[1]; // indexes are for example

elem.style.borderColor = 'blue';
elem.style.backgroundColor = 'magenta';
elem.style.color = '#00FF00';

型
是的，这将需要许多CSS更改。你想改变整个网站的外观-当然，它会。我不认为你的网站的设计师已经用magenta通过内联样式为每个元素着色-有现有的样式，明智地选择选择器和类，你会很容易做到这一点。

赞(0）回复(0）举报 2023-08-04

我来回答

jquery 更改所有元素的颜色

2条答案

相关问题

热门标签

最新问答