存在しないスタイル参照を見つける

Question

私のHTMLに参照しているすべてのCSSクラスが実際には存在しないことがわかるツールはありますか？

ie。私のHTMLに< ul class = "topnav"/>があり、topnavクラスが参照されているCSSファイルに存在しない場合

これは、未使用のCSSスタイルを見つける方法を尋ねるSO#33242に似ています。これは重複ではありません。その質問はどの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は正確に何をしたいんです。

未使用のセレクタをすべて探します。