読み込んでいるCSS内に指定したルールが記述されているかを確かめるメソッドを書いてみた

このページでこのクラスを読み込んでたっけ？とCSSファイルを探さないとすぐには分からない場合があるとおもいます。そこで今回は、$.isRuleExist()というメソッドを作成してみました。以下がそのソースになります。

ソース

(function($){
     $.extend({
       isRuleExist:function(className){
              var classes = [];
              var sheets = document.styleSheets;
              var push = Array.prototype.push;
              for(var i = 0,n = sheets.length; i < n; i++){
                push.apply(classes, sheets[i].rules || sheets[i].cssRules);
              }
              for(var i = 0,n = classes.length; i < n; i++){
                 if(classes[i].selectorText == className){
                         return true;
                 }
             }
             return false;
          }
     });
})(jQuery);

使い方

$.isRuleExist(".entryList li");
もしCSSファイルにこのルールが存在すればtrueなければfalseを返します

うーん、でも普通にChrome Dev Toolでリソースを調べた方が速いかも。