因此,如果有一个链接到网页的css文件,例如:
<link href="style.css" rel="stylesheet" type="text/css">
并且我想读取某个属性,例如div具有className =’layout’,并且我想使用JavaScript读取此属性的详细信息,我该怎么做?
我搜索了很多,但几乎没有运气,请提出建议。
您有两种选择:
document.styleSheets
getComputedStyle
currentStyle
在你的榜样,试图得到一定的属性(比如说:color)有一个div class="layout":
color
class="layout"
function getStyleProp(elem, prop){ if(window.getComputedStyle) return window.getComputedStyle(elem, null).getPropertyValue(prop); else if(elem.currentStyle) return elem.currentStyle[prop]; //IE } window.onload = function(){ var d = document.createElement("div"); //Create div d.className = "layout"; //Set class = "layout" alert(getStyleProp(d, "color")); //Get property value }
关于您的问题的评论 ,另一个函数: 下面的函数将忽略当前元素的内联样式定义。如果您想知道从样式表继承的样式定义(不包含父元素的继承样式定义),请遍历树并临时擦除.cssText属性,如以下功能所示:
.cssText
function getNonInlineStyle(elem, prop){ var style = elem.cssText; //Cache the inline style elem.cssText = ""; //Remove all inline styles var inheritedPropValue = getStyle(elem, prop); //Get inherited value elem.cssText = style; //Add the inline style back return inheritedPropValue; }