Question

对于背景，我正在尝试在网站上创建暗模式。我希望用户能够单击一个可以翻转站点颜色的按钮。到目前为止，我已经拼凑了这个JavaScript代码段

var style = getComputedStyle(document.body);

function darkMode() {
    if (style.getPropertyValue('--text-white') === "rgb(254, 254, 254)") {
        style.setProperty('--text-white', "rgb(43, 42, 42)");
        style.setProperty('--text-black', "rgb(254, 254, 254)");
    } else {
        style.setProperty('--text-white', "rgb(254, 254, 254)");
        style.setProperty('--text-black', "rgb(43, 42, 42)");
    }
}

我的目的是更新：root

下的css文件中的变量

:root {
  --text-white: rgb(254, 254, 254);
  --text-black: rgb(43, 42, 42);
}

style.getPropertyValue可以返回正确的值，但是当我尝试运行其余代码时，我会得到

（索引）：191未捕获的DOMException：无法在'CSSStyleDeclaration'上执行'setProperty'：这些样式是经过计算的，因此'--text-white'属性是只读的。

关于如何继续前进的任何提示？

设置计算的样式（无法在“ CSSStyleDeclaration”上执行“ setProperty”：这些样式已计算出来）

0 个答案: