Je ne suis pas en mesure d'injecter un style avec de “!important” règle

J'ai essayé d'injecter un style à l'aide de ce code:

document.body.style.color='green!important';

Par la cascade CSS ref, par l'application de la !important règle que je peut l'emporter sur l'origine et la spécificité.

J'ai essayé d'injecter ce à l'aide de Firefox Firebug dans www.google.com cependant, pas de chance.

Comment puis-je injecter une couleur de premier plan avec un !important règle?

Avez-vous essayé avec un espace ? document.body.style.color = "green !important";

InformationsquelleAutor android_baby | 2011-10-27

97

Par la spec, si vous souhaitez définir la priorité, non seulement la valeur, vous devez utiliser setProperty, comme suit:
```
document.body.style.setProperty ("color", "green", "important");
```
- IE9+ seulement. Apparemment, vous pouvez utiliser setAttribute au lieu de <IE9 (pas sûr de savoir comment loin en arrière). Quelqu'un pourrait-il préciser si il est possible d'utiliser setAttribute pour spécifier la priorité ainsi, il n'est pas clair pour moi si vous le pouvez.
- En supposant que la mise en œuvre est correcte, il devrait être possible - !important peut légalement apparaissent dans inline déclarations de style.
- href="https://msdn.microsoft.com/en-us/library/ie/ms536739%28v=vs.85%29.aspx" >msdn.microsoft.com/en-us/library/ie/ms536739%28v=vs.85%29.aspx IE8 semble appuyer setAttribute
- Pour qui les specs?
- css-style-attr, qui suit tout simplement la même grammaire utilisée dans le reste de la CSS.
InformationsquelleAutor Boris Zbarsky
8
```
element.style.cssText = 'color:green !important';
```
devrait fonctionner pour vous.
- Qui fonctionne si il n'y a pas d'autres styles de jeu sur l'élément, sinon il va écraser toutes les autres styles sur l'élément et de les perdre.
- si il y a d'autres styles sur l'élément, simplement concaténer vos styles: element.style.cssText += ';color: green !important;' et vous êtes en sécurité sur les navigateurs qui prennent en charge cssText propriété! 🙂
- Méthode (c'est à dire ... += ...) donné par @guari fonctionne, mais seulement dans la mise à niveau de la priorité d'un style "!important". Déclassement de la '!important", d'autre part, ne va pas. c'est à dire element.style.cssText += 'color:blue', ne va pas tout element.style.cssText += 'color:blue !important' fonctionne.
InformationsquelleAutor Jayachandran
2

toutes les réponses sont grands, mais ils ont tous assumé la value de l'attribut est fixed, si pas

jeter un regard à ma solution
```
this.style.setProperty("color", $(this).css('color'), "important");
```
au lieu de hand writing la valeur, je l'ai eu à l'aide de jquery $(this).css('attr')

InformationsquelleAutor Basheer AL-MOMANI
1

Je voudrais poser et qu'il ne peut pas travailler non pas tant en raison d'une erreur dans le code (à l'exception de l'espace), mais plus parce que la modification de la balise body n'est pas assez précis de l'élément, de la classe, ou qu'avez-vous à créer l'effet désiré.

Comme par exemple le texte de la page de résultat de recherche a une classe de "saint".
tous les résultats de recherche sont chaque encapsulé dans un
<li>
la balise.

Donc un peu de code pour un tel effet pourrait ressembler à ceci:
```
var arr = document.getElementsByClassName('st');
for(i=0; i<arr.length; i++){
    arr[i].style.color="green";
}
```
- hanks pour les réponses a essayé d'injecter document.corps.style.couleur = "vert !important"; sur la bbc.co.royaume-uni en utilisant firefox firebug mais pas de chance 🙁 voir dans le style dans firebug, c'est en raison de * { color: #505050; } ne pouvez pas le voir "!important" de la qualification de la source, donc je suis perplexe @Ahren, j'ai pensé à la source (de l'utilisateur important) ont éclipsé toutes les autres règles quelle que soit la spécificité a été? Ref:w3.org/TR/CSS2/cascade.html (6.4.1 cascade de commande) & si je injectée !important, il serait un utilisateur déclaration importante à prendre en compte tous les autres cad règles ne connaissais pas "accepter la fonctionnalité" 😀
InformationsquelleAutor Ahren Bader-Jarvis
1

Utiliser seulement ceci:
```
document.body.style.color="green";
```
vous ne pouvez pas utiliser importants de cette façon. De toute façon comme Fatale souligné, cela ne fonctionnera pas, quand il est directement règle importante dans la feuille de style css, que vous avez besoin pour remplacer.

De cette façon, vous avez à dynamicaly créer la feuille de style et d'annonces à l'intérieur de la tête:
```
function addNewStyle(newStyle) {
   var styleElement = document.getElementById('styles_js');
   if (!styleElement) {
       styleElement = document.createElement('style');
       styleElement.type = 'text/css';
       styleElement.id = 'styles_js';
       document.getElementsByTagName('head')[0].appendChild(styleElement);
   }
   styleElement.appendChild(document.createTextNode(newStyle));
}
```
Ensuite, vous pouvez mettre à jour le style juste comme ça
```
addNewStyle('body {color:green !important;}')
```
- Ce sera battu par un style CSS avec ID-Sélecteur de et de !important. HTML: <body id="illwin" style="color:green;"> This is a test! </body> CSS: #illwin { color: red !important; } Cela se traduira dans le texte en rouge. jsfiddle.net/C6zH2
InformationsquelleAutor Marian Bazalik
1

style.cssText est la seule façon d'ajouter de la !important.
```
<script>
   document.body.style.cssText='color: red !important;'
</script>
```
InformationsquelleAutor VISHNU Radhakrishnan

Vous devez vous connecter pour publier un commentaire.