javascript - 如何使用 CSS 类填充文本区域？

Question

是否有任何 javascript 函数可以让我显示一个 css 类？

比如说我有课:

.formInput{
   width:100px;
   height:20px;
   border:1px solid #000;
}

我确实想在文本区域中显示该类...这可能吗？ 如果没有，是否有一种方法可以显示元素的所有已设置 css 属性？

Answer 1

这适用于 Firefox，也适用于 Chrome:

function getCss(className) {
    for (var i = 0; i < document.styleSheets.length; i++) {
        for (var j = 0; j < document.styleSheets[i].cssRules.length; j++) {
            if (document.styleSheets[i].cssRules[j].selectorText == "." + className) {
                return document.styleSheets[i].cssRules[j].cssText;
            }
        }
    }
    return "";
}

对于 IE，按照这些思路可能会让您走上正轨......

var elem = document.getElementById('foo');
var styleInfo = '';
for (var style in elem.currentStyle) {
    styleInfo += style + ": " + elem.currentStyle[style] + "\n";
}

根据您要解决的具体问题，另一种可能的(hacky)方法是获取样式元素 (document.getElementsByTagName("style"))，然后使用常规在他们的 innerHTML 中搜索您想要的文本的表达式