Количество кол-во селекторов в файле css

существует ли существующий плагин/приложение/программа/ script/все, что анализирует и подсчитывает селектор css файла? Я хочу проверить, не является ли причина, по которой мой css файл не работает в IE, потому что мой счетчик выбора более 4095 (что им довольно уверенно нет)

спасибо!

p.s. плюс точки, если есть решение haml/sass/compass

Ответы

Ответ 1

В Firebug-консоли в Firefox можно запустить следующий фрагмент, чтобы подсчитать общее количество селекторов CSS (а не только CSS-правил) и проверить, достигает ли он предел 4095 селекторов на таблицу стилей:

var
  styleSheets = document.styleSheets,
  totalStyleSheets = styleSheets.length;

for (var j = 0; j < totalStyleSheets; j++){
  var
    styleSheet = styleSheets[j],
    rules = styleSheet.cssRules,
    totalRulesInStylesheet = rules.length,
    totalSelectorsInStylesheet = 0;

  for (var i = 0; i < totalRulesInStylesheet; i++) {
    if (rules[i].selectorText){
      totalSelectorsInStylesheet += rules[i].selectorText.split(',').length;
    }
  }
  console.log("Stylesheet: "+styleSheet.href);
  console.log("Total rules: "+totalRulesInStylesheet);
  console.log("Total selectors: "+totalSelectorsInStylesheet);
}

Ответ 2

Мой проект, Bless CSS, может быть тем, что вы ищете. Он будет анализировать файлы и разбивать их на оптимальную точку в зависимости от предела выбора.

Он также встроен в CodeKit.

Ответ 3

Существует этот букмарклет, в котором указано количество используемых правил CSS из общих правил CSS (которые вас интересуют).

CSS Crunch

Ответ 4

Это сделает встроенный CSS...

var selectors = 0;

$('style').each(function() {

   var styles = $(this).html();

   // Strip comments
   styles = styles.replace(/\/\*.+?\*\//sg, ''); 

   var matches = styles.match(/\{[\s.]*\}/g);

   selectors += matches.length;

});

jsFiddle.

Ответ 5

Простой алгоритм подсчета селекторов, если вы хотите сделать это как часть процесса сборки или просто не хотите делать это в JS:

Замените тексты между "{" и "}" на ",", а затем подсчитайте число ",". Это даст вам количество селекторов в файле.

Ответ 6

немного допоздна, но для всех, кто ищет css-селекторный счетчик: http://snippet.bevey.com/css/selectorCount.php он очень прост и может работать с более чем одной таблицей стилей, он даже сообщает вам, когда вы нажимаете предел 4096

Ответ 7

Найдите и замените "{" на "{" в вашем файле CSS. Большинство редакторов расскажут, сколько изменений вы сделали...