Javascript getComputedStyle给出了；透明的；而不是实际的背景色

这是一个惊喜。以下代码似乎没有给出屏幕上的实际颜色：

h1 = document.querySelector("h1");
window.getComputedStyle(h1).color

给出了我认为正确的

rgb（0,0,0）

。然而

window.getComputedStyle(h1).backgroundColor

给出

rgba（0,0,0,0）

。我在屏幕上看到的实际背景色是白色

我称之为h1的元素在屏幕上可见。我希望得到实际的背景色。我在上面得到的值（rgba）没有错，但也不是很有用。它只是告诉我背景是完全透明的，而不是一种颜色

如何获得RGB中的实际背景色？

getComputedStyle（h1）

提供在活动样式表中应用元素后的css值

这意味着您只能以任何方式获得应用于特定元素的css值

例如：-如果您为

h1:RGB{255，255，255}应用背景，

则您将获得RGB格式的白色背景，否则不会。它不为html的默认样式提供值

要通过

getComputedStyle（）

获取该值，首先应将其应用于元素

---

如需了解更多信息，请在css中设置背景颜色：rgba（255、255、255，

0

）

getComputedStyle（）

将返回

transparent

（在某些浏览器中）而不是rgba值

简单的解决方法是将alpha设置为高于0的值

---

rgba（255、255、255，

0.01

）；这将返回rgba（255、255、255，

0.01

）

尝试使用dom遍历，如果当前元素的bg是透明的，则检查父元素等等。谢谢@Tony，但getComputedStyle应该准确地告诉我。@Leo:你认为为什么应该这样做？一个非常好的问题，@Bergi。我现在意识到，

background color

与其他值有些不同，因为它依赖于父元素的

background color

之外的许多其他因素。在另一个元素a

上测试，我再次得到这个

rgba（0,0,0,0）

，即使实际背景是黄色的。不涉及

位置

，

浮动

等。该元素位于具有CSS黄色背景的包含元素的框中。但是，我可以看到返回

rgba（0,0,0,0）

的原因。但是@Bergi仍然阻止我做我想做的事情。我想得到前景和背景颜色之间的对比度，以便测试这部分的可访问性。现在看来，我认为这在javascript中是不可能的。嗯，谢谢，是的，这是我看到的，当然，但我如何获得html默认样式颜色值？问题是Firefox：）我浪费了一整天的时间寻找getComputedStyle返回透明而不是rgba的原因