为什么DOM样式节点不显示由样式表应用的样式？ [英] Why doesn't the DOM style node show styles applied by a style sheet?

问题描述

我有一个jsfiddle在这里 - http://jsfiddle.net/stevea/R3z2j/2/ - 我在样式表中将红色背景应用于body，但是当我在DOM中使用 $ b

style = document.body.style;
bgclr = document.body.style.backgroundColor;


没有任何背景颜色。

谢谢 解释方案

/ p>

element.style 表示元素的样式属性，或元素自己的样式，如样式属性或直接操作。

要获取元素实际使用的样式（包括继承），可以使用 getComputedStyle（） in < a href =http://caniuse.com/#feat=getcomputedstyle =nofollow>大多数浏览器（可选地使用 getPropertyValue（） ）或 element.currentStyle in oldI E：

  window.getComputedStyle（document.body）.backgroundColor 
 window.getComputedStyle（document.body）.getPropertyValue （'background-color'）
 
 document.body.currentStyle.backgroundColor 
  

或者，因为您使用jQuery，您还可以使用 .css（propertyName ） ：

  $（document.body）.css（'background-color ）; 
  

I have a jsfiddle here -http://jsfiddle.net/stevea/R3z2j/2/ - where I've applied a red background to the body in a style sheet, but when I look at the body's style node in the DOM with

style = document.body.style;
bgclr = document.body.style.backgroundColor;

there's nothing there for background color.

Thanks

解决方案

To elaborate on my comment...

element.style "represents the element's style attribute," or the element's own styles as from the style attribute or direct manipulation.

To get the styles the element is actually using (including inherited), you can use getComputedStyle() in most browsers (optionally with getPropertyValue()) or element.currentStyle in oldIE:

window.getComputedStyle(document.body).backgroundColor
window.getComputedStyle(document.body).getPropertyValue('background-color')

document.body.currentStyle.backgroundColor

Or, since you're using jQuery, you can also use .css(propertyName):

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

这篇关于为什么DOM样式节点不显示由样式表应用的样式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！