changement sélecteur de règle de stylesheet dynamiquement

Question

Ceci est une version simplifiée de la façon de modifier dynamiquement une règle de sélection:

http://jsfiddle.net/vsync/SaQy6/

Pour un style en ligne de donneur:

<style type='text/css' id='myStyle'> 
    ul > li{} 
</style> 

essayer changer le sélecteur

Ni selectorText ou cssText de travailler pour définir le sélecteur dynbamiquement.

Ensuite, je lis sur MDN que selectorText est en lecture seule, et je ne sais pas comment changer le sélecteur sans avoir à supprimer tout l'élément de style et en créer un nouveau. Il est possible de supprimer complètement la règle et d'insérer une nouvelle règle, mais elle est très non standard. Des idées?

Answer 1

Démo - http://jsfiddle.net/vsync/SaQy6/6/

façon cross-browser:

var styleTag = document.querySelector('#myStyle'); 
// the style sheet in the style tag 
var sheet = styleTag.sheet ? styleTag.sheet : styleTag.styleSheet, 
    rules = sheet.cssRules ? sheet.cssRules : sheet.rules; 

if(sheet.cssRules){ 
    sheet.deleteRule(0); // deletes a rule at index 0 
    sheet.insertRule("ul > li:nth-child(2n){background:red}", 0); 
} 
else{ 
    sheet.removeRule(0); // deletes a rule at index 0 
    sheet.addRule("ul > li:nth-child(2n)", 'background:red', 0); 
} 

Dernière question

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Questions connexes

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.