Question

有谁可以告诉我为什么document.body.style.backgroundColor无法使用外部CSS样式表？我的意思是：当我有

时

body
{
    background-color: red;   
}

在我的css样式表中，javascript alert alert(document.body.style.backgroundColor);显示空字符串。工作示例here。

但是当我有

时

<body style="background-color: red;"></body>

它显示（应该）＆＃34;红色＆＃34;。示例here。

我希望得到一个很好的解释，甚至更多的答案如何修复第一个例子。

Answer 1

DOM元素上的

.style属性为该特定元素返回CSSStyleDeclaration。根据{{1}}访问的定义，它是元素本身的样式。 .style属性控制相同的值，因此您可以看到结果。

但是，使用选择器应用的CSS不直接是元素的属性。考虑一下CSS style=。这个CSS适用于多个元素，因此，在特定元素的某个层次上无法覆盖。

您正在寻找的是p { color: red }获取元素当前样式的只读视图：window.getComputedStyle确实返回正确的值，如{{3}中所示}。

Answer 2

你正在使用jquery buddy

试试这个会给出rgb值

alert($('body').css('background-color'));

Js Fiddle

如果你想要十六进制值，试试这个

Js Fiddle

Answer 3

试试这个

var element =     document.getElementsByTagName('body')[0];                     
var style = window.getComputedStyle(element),
var bgColor    = style.getPropertyValue('background-color');

document.body.style.backgroundColor不适用于外部CSS样式表

3 个答案: