我想通过单击详细找到应用类的完整CSS信息.喜欢
<div class="class1 class2">This is my div</div>
假设我在xyz.css文件中写了CSS
.class1{
background-color:#999999;
width:auto;
overflow:hidden;
}
.class2{
background-color:#856241;
width:500px;
overflow:hidden;
}
单击div之后,我要显示应用于div的所有css信息.
jQuery解决方案将是首选.
根据前几个答案,我得到了所有计算出的样式,但是我对我唯一应用的类样式细节感兴趣.
解决方法:
您可以通过以下方式获取元素的当前样式:
var elem = ...;
var css = document.defaultView ? document.defaultView.getComputedStyle(elem, null) : elem.currentStyle;
if ('length' in css) {
// iterate over all property names
for (var i = 0, l = css.length; i < l; ++i) {
var propertyName = css[i];
// get property value
var value = css[propertyName];
if (value != void 0) {
console.log(propertyName+': '+value);
}
}
} else {
// IE
for (var propertyName in css) {
// get property value
var value = css[propertyName];
if (value != void 0) {
console.log(propertyName+': '+value);
}
}
}
在这里尝试:http://jsfiddle.net/P5WYC/2/
您可能还想尝试使用document.styleSheets(请参见http://www.quirksmode.org/dom/w3c_css.html)