Question

我只是问自己在做错什么，因为我以前已经做过，我只是不记得怎么做，而且我一定会丢失旧代码。

Firefox具有未记录的颜色值-moz-win-accentcolor，可用于获取Windows 10 Accent颜色。

如果我直接在样式表中使用该颜色名称（在我的扩展名中，以匹配系统的主题），则效果很好，但是我需要使颜色变暗或变浅，否则我将无法做到这一点颜色数据本身。

这就是我所得到的，我正在使用window.getComputedStyle和getPropertyValue来获取颜色数据。我不在乎它是十六进制还是RGBA，地狱，我不在乎它是否是二进制。我只需要能够混合颜色即可操纵颜色数据。

function getComputedAccent() {
    let fakeEl = document.createElement("div");

    fakeEl.style = "background: -moz-win-accentcolor";

    return window.getComputedStyle(fakeEl).getPropertyValue("background");
}

但这只会返回一个空字符串。知道我忘记了什么吗？

（是的，我知道这是黑客行为，我不在乎。）

Answer 1

我真是愚蠢。该代码可以正常工作，但有一点改动。

function getComputedAccent() {
    let fakeEl = document.createElement("div");

    fakeEl.style = "background-color: -moz-win-accentcolor";

    return window.getComputedStyle(fakeEl).getPropertyValue("background-color");
}

getComputedAccent()
"rgb(55, 60, 72)"

它以空字符串作为响应，因为background属性并不总是一种颜色。它可以是图像。将其更改为background-color，就可以了。

经过编辑以添加更多有用的代码。

function getComputedAccent() {
    let fakeEl = document.createElement("div");

    fakeEl.setAttribute("style", "background-color: -moz-win-accentcolor");

    let color = window.getComputedStyle(fakeEl).getPropertyValue("background-color");
    color = color.match(/rgb\((\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/);
    color.shift();
    color = color.map((value) => parseInt(value, 10));

    return color;
}

JavaScript getComputedStyle无法使用颜色名称吗？

1 个答案: