Get Stylesheet Règle Javascript/jQuery

Question

Je suis en train d'écrire une fonction qui recevra une règle CSS pour mettre à jour avec le CSS pour mettre à jour la règle avec, jusqu'à présent, je donne les résultats suivants:

getCSSRule:function(getRule, newRule){ 
    var styles=document.styleSheets; 
    for(var i=0,l=styles.length; i<l; ++i){ 
     var sheet=styles[i]; 

     if(sheet.title === "style"){ 
      var rules=sheet.cssRules; 
      for(var j=0, l2=rules.length; j<l2; j++){ 
       var rule=rules[j]; 

       // SELECT APPROPRIATE RULE IN STYLESHEET 
       if(getRule === rule){ 

        // LOSE IT HERE 

       }; 
      }; 
     }; 
    }; 
}, 

Alors loin le code fonctionne. Il trouve toutes les feuilles de style, en cible une par titre, puis boucle les règles de cette feuille de style. Le problème que je rencontre actuellement est de comparer getRule (nom de la règle CSS passé dans la fonction) avec la règle dans le CSS. Je suis nouveau à l'utilisation de document.styleSheets et trouve la structure quelque peu confuse. Toute aide est grandement appréciée. Merci!

Answer 1

Les règles CSS n'ont pas de noms. Peut-être que vous vouliez dire selectorText? Si oui, vous pouvez choisir la bonne règle comme ceci:

if (getRule === rule.selectorText) { 
    /* do stuff */ 
} 

getRule est le sélecteur exact (s) de la règle voulue. Dans le cas "exact" signifie forme vraiment exacte du sélecteur. Exemple stylesheet:

.div {...} 
#div {...} 
div {...} 
div:hover {...} 

Si vous voulez changer la règle pour div classe, votre getRule devrait être .div, si vous voulez changer la règle pour div.hover, getRule devrait être .div:hover etc.