如何获取 HTML 文档的根样式声明？ [复制]

Question

我在:root 和全局命名空间中定义了一些样式。但是当我尝试以编程方式访问它们时，我收到了一个错误：

TypeError: Window.getComputedStyle: Argument 1 does not implement interface Element.

这是我的风格规则：

:root {
    --my-css-variable: green; 
}

这是我尝试过的：

var variable = "--my-css-variable";


// all of the following error
window.getComputedStyle(window).getPropertyValue(variable);
window.getComputedStyle(window.document).getPropertyValue(variable);
window.getComputedStyle(window.document.body).getPropertyValue(variable);

当我在页面上选择一个元素并查看调试工具时，它说元素是从 HTML 继承的：

Answer 1

你可以试试：

getComputedStyle(document.documentElement)
    .getPropertyValue('--my-css-variable');