查找不存在的样式引用

Question

是否有工具可以为我找到所有在我的HTML中引用的实际上不存在的CSS类？

即。如果我在我的HTML中有< ul class =“topnav”/ >，并且topnav类不存在于任何引用的CSS文件中。

这与SO#33242类似，它询问如何找到未使用的CSS样式。这不是重复的，因为该问题询问哪些CSS类不被使用。这是相反的问题。

Answer 1

你可以把这个JavaScript中，可以为您执行此任务的页面：

function forItems(a, f) { 
    for (var i = 0; i < a.length; i++) f(a.item(i)) 
} 

function classExists(className) { 
    var pattern = new RegExp('\\.' + className + '\\b'), found = false 

    try { 
    forItems(document.styleSheets, function(ss) { 
     // decompose only screen stylesheets 
     if (!ss.media.length || /\b(all|screen)\b/.test(ss.media.mediaText)) 
     forItems(ss.cssRules, function(r) { 
      // ignore rules other than style rules 
      if (r.type == CSSRule.STYLE_RULE && r.selectorText.match(pattern)) { 
      found = true 
      throw "found" 
      } 
     }) 
    }) 
    } catch(e) {} 


    return found 
} 

Answer 2

Firefox中的错误控制台。虽然，它给出了所有 CSS错误，所以你必须仔细阅读它。

Answer 3

IntelliJ Idea工具也可以。

Answer 4

This Firefox extension是你想要做什么。

它定位所有未使用的选择器。