Número de selectores en un archivo css

Question

¿Existe un complemento/aplicación/programa/script/lo que sea que analice y cuente los selectores css de un archivo? Quiero comprobar si la razón por la que mi archivo css no está funcionando en IE es porque mi número de selector es más de 4095 (que estoy bastante seguro)

gracias!

p.s. más puntos si hay una solución de haml/sass/brújula

Answer 1

El siguiente fragmento de código se puede ejecutar en la consola de Firebug en Firefox para contar el número total de selectores CSS (no sólo las reglas CSS) y comprobar si se alcanza el limit of 4095 selectors por hoja de estilo:

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); 
} 

Answer 2

Hay este bookmarklet que le indica el número de reglas de CSS usadas fuera de las reglas de CSS totales (que le interesan).

CSS Crunch

Answer 3

Esto hará CSS en línea ...

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.

Answer 4

Buscar & reemplazar "{" por "{" en su archivo CSS. La mayoría de los editores le dirá cuántos reemplazos ha realizado ...

Answer 5

Mi proyecto, Bless CSS, podría ser lo que está buscando. Analizará los archivos y los dividirá en el punto óptimo según el límite del selector.

También está incorporado en CodeKit.

Answer 6

algoritmo simple para contando los selectores si desea hacerlo como parte del proceso de compilación o simplemente no desea hacerlo en JS:

Reemplace los textos entre "{" y "}" con un "," y luego calcule el número de ",". Esto le dará la cantidad de selectores en el archivo.

Answer 7

un poco de retraso, pero para nadie cómo está buscando un contador de selector CSS: http://snippet.bevey.com/css/selectorCount.php es muy sencillo, y puede trabajar con más de una hoja de estilo, que incluso le dice cuando se pulse el límite de 4096