使用Javascript列出已知的CSS类

Question

我正在尝试找到一种很好的方法来收集给定文档中包含的样式表中定义的类的名称.我知道,document.StyleSheetList但似乎并不容易解析.我正在寻找的是类似于样式表文档,例如:

.my_class { 
    background: #fff000; 
}
.second_class {
    color: #000000;
}

我可以提取一个数组["my_class", "second_class"].这显然假设了满载的dom和样式表的有利场景.

我一直在寻找一个好的方法来做这样的事情到目前为止,没有取得什么进展.有没有人知道如何解决这个问题？谢谢!

Answer 1

这将显示样式表中定义的所有规则.

var allRules = [];
var sSheetList = document.styleSheets;
for (var sSheet = 0; sSheet < sSheetList.length; sSheet++)
{
    var ruleList = document.styleSheets[sSheet].cssRules;
    for (var rule = 0; rule < ruleList.length; rule ++)
    {
       allRules.push( ruleList[rule].selectorText );
    }
}

但事情是它包含所有规则,无论是类,标签,id还是其他什么.

您需要更详细地解释您希望非类规则(或组合规则)发生什么