Question

我正在编写一个Greasemonkey脚本，在脚本中的某个时刻，我想更改当前有一个元素的页面上每个元素的背景颜色。我知道我可以从他们的ID中获取元素，并改变他们的CSS，如下所示：

document.getElementById("char").style.backgroundColor = "#FFFFFF";

但是有可能以相反的方式做到这一点，这比循环遍历页面上的每个元素以检查它是否具有背景颜色并更改它更快吗？

// use a new background colour instead
document.getElementByCSS("background-color").style.backgroundColor = "#FFFFFF";

我想避免使用JQuery。

Answer 1

根据穆萨上面所说的话 “使用内联css你可以做document.querySelectorAll（'[style * =”background-color“]'）但我看不出计算样式的任何方法。” 我的案例涉及内联CSS，所以一切都很好。

Answer 2

我不推荐它，但你可以使用这个功能

function findByCss( prop, val ) {
        var 
        retArr = [],
        allElms = document.getElementsByTagName('*'),
        computed,
        i = 0;
        for ( ; i < allElms.length; i++ ) {
            computed = window.getComputedStyle( allElms[i], null ).getPropertyValue(prop);
            if ( computed.indexOf( val ) >= 0 ) {
                retArr.push( allElms[ i ] );
            }
        }

        return retArr;

    }

它返回一个元素数组，这些元素计算样式包含您要查找的样式属性的值，如果您愿意，可以将其更改为不太宽容的条件。另一方面，所有十六进制颜色代码都计算为RBG，因此在您使用此函数之前，必须找到十六进制代码的RGB值。

Javascript使用CSS属性查找元素

2 个答案: