为什么这种颜色分配不会影响页面上的所有元素？

Question

我正在处理 this answer, except with pure Javascript, and not jquery. I've attempted to change all elements that have a color assignment to a pink color. I'm walking through the elements backwards in my loop. Injecting this code on https://en.wikipedia.org/wiki/Main_Page，例如，只更改了一些背景颜色；尽管检查元素具有 CSS 颜色属性，但许多元素保持不变。为什么这个颜色分配不会影响页面上所有具有颜色属性的元素？

// CSS properties that can change color
let CSSPropsColor =
[
"background",
"background-color",
"text-shadow",
"text-decoration-color",
"text-emphasis-color",
"caret-color",
"border-color",
"border-left-color",
"border-right-color",
"border-top-color",
"border-bottom-color",
"border-block-start-color",
"border-block-end-color",
"border-inline-start-color",
"border-inline-end-color",
"column-rule-color",
"outline-color",
"color",
]

function pinkAll()
{
    // get all elements
    var allEl = document.getElementsByTagName("*");
    
    // walk backwards through loop
    for (var i=allEl.length-1; i > -1; i--) {
            var color = null;
            
            for (var prop in CSSPropsColor) {
                prop = CSSPropsColor[prop];
                
                //if we can't find this property or it's null, continue
                if (!allEl[i].style[prop]) continue;
                
                var bgColor = window.getComputedStyle(allEl[i],null).getPropertyValue(prop).toString();
                
                let firstChar = bgColor.charAt(0);
                
                if(firstChar !== "r" && firstChar !== "#") continue;
                
                allEl[i].style[prop] = "#EC00FF" // change element color to PINK
                
            }
    }
}

window.addEventListener('load', function () {
    // sometimes 'load' is not enough, and I have to wait a bit
    let timeout = setTimeout(pinkAll, 500);
})

Answer 1

您的 if 语句：if (!allEl[i].style[prop]) continue; 在遇到未设置样式的元素时随时继续 inline。使用 if (!window.getComputedStyle(allEl[i],null).getPropertyValue(prop)) continue; 将整个页面设置为粉红色...

为什么这种颜色分配不会影响页面上的所有元素？

How come this color assignment is not affecting all elements on the page?

html

javascript

css

code-injection