如何获取Google Chrome中所有加载的CSS类的列表？

Question

有时我需要打印一个CSS类列表来找到合适的类.

最适合我的是JS控制台中的函数:在输入时加载和过滤JS类列表.

因此,例如,如果我需要记住一个图像类,我正在键入"Img",然后加载一个图像类列表("ImgFolder","ImgPencil"......).

Answer 1

var allTags = document.body.getElementsByTagName('*');
var classNames = {};
for (var tg = 0; tg< allTags.length; tg++) {
    var tag = allTags[tg];
    if (tag.className) {
      var classes = tag.className.split(" ");
    for (var cn = 0; cn < classes.length; cn++){
      var cName = classes[cn];
      if (! classNames[cName]) {
        classNames[cName] = true;
      }
    }
    }   
}
var classList = [];
for (var name in classNames) classList.push(name);
alert(classList);

来源： https: //stackoverflow.com/a/23067859/

该代码将以数组形式为您提供页面上所有类的列表。这应该足以让您开始。如果您需要过滤课程的帮助，请发表评论，我将编辑答案。

编辑：误解了这个问题。https://developer.mozilla.org/en-US/docs/Web/API/document.styleSheets