Javascript 获取DOM元素的所有css样式（la Firebug）

对于DOM元素，如何获取css中为特定元素指定的所有样式？这是一种迭代所有css样式名称的情况吗

还是有更优雅的方式？萤火虫是怎么做到的

谢谢

对于DOM元素，如何获取所有 在css中指定的样式 特定元素？这是一个案例吗 迭代所有css样式名称

是的

还是有更优雅的方式

我不知道是否更优雅（优雅在主观尺度上是相当高的），但如果您使用jQuery之类的库，它肯定会更短更甜美。下面是一个解决方案，有人编写了代码来回答另一个问题：

萤火虫是怎么做到的

---

我不知道。

对于这样的元素，您可以遍历所有CSS样式：

var myElement = document.getElementById('someId');
var myElementStyle = myElement.style;

for(var i in myElementStyle){
    // if it's not a number-index, print it out.
    if(/^[\d]+/.exec(i) == null){
        console.log("Style %s = %s", i, myElementStyle[i]);
        /*
         * Do other stuff here...
         */
    }
}

---

您应该能够通过以下方式获得：

var css=window.getComputedStyle（元素）；
对于（var i=0；iprevenous解决方案，在展开之前修改样式时会损坏样式。
此外，您还可以获得许多默认样式

我的解决方案剥离默认样式，并通过元素保留级联样式

在控制台中运行并从Elements视图复制所需的元素。（在chrome中测试）

函数设置样式（元素）{
var els=元素.children；
对于（var i=0，maxi=els.length；i
Hi-感谢您的建议-但是myElementStyle[i]似乎总是空的。我的样式是从外部css设置的，而不是从内部设置的。这很好，因为它还显示了不同css类应用于元素的样式（不仅仅是内联样式）。如果您想要特定的css元素，可以使用：
window.getComputedStyle（元素）.getPropertyValue（'font-size'）
var css = window.getComputedStyle(element);
for (var i=0; i<css.length; i++) {
    console.log(css[i] +'='+css.getPropertyValue(""+css[i]))
}

function setStyle(theElement) {
    var els = theElement.children;
    for(var i = 0, maxi = els.length; i < maxi; i++)
    {
        setStyle(els[i]);

        var defaultElem = document.createElement(els[i].nodeName)
        var child = document.body.appendChild(defaultElem);
        var defaultsStyles = window.getComputedStyle(defaultElem,null);     

        var computed = window.getComputedStyle(els[i],null).cssText;

        for(var j = 0, maxj = defaultsStyles.length; j < maxj; j++)
        {
            var defaultStyle = defaultsStyles[j] + ": " + defaultsStyles.getPropertyValue(""+defaultsStyles[j]) + ";"
            if(computed.startsWith(defaultStyle)) {
                computed = computed.substring(defaultStyle.length);
            } else {
                computed = computed.replace(" " + defaultStyle, "");
            }
        }

        child.remove();

        els[i].setAttribute("style", computed);
    }
}

setStyle(document.getElementsByTagName("body")[0]);

console.log("DONE");