私はこのコードを使用してスタイルを注入しようとしました:
document.body.style.color='green!important';
CSSカスケードref ごとに、!important
ルールを適用することで、Originと特異性に勝ちます。
Firefox Firebugを使用してwww.google.comにこれを挿入しようとしましたが、運はありません。
!important
ルールを使用して前景色を挿入するにはどうすればよいですか?
仕様に従って、値だけでなく優先度を設定する場合は、setProperty
を次のように使用する必要があります。
document.body.style.setProperty ("color", "green", "important");
element.style.cssText = 'color:green !important';
あなたのために働くはずです。
すべての答えは素晴らしいですが、属性のvalue
がfixed
であると仮定しています。
私の解決策を見てください
_this.style.setProperty("color", $(this).css('color'), "important");
_
_hand writing
_値ではなく、jquery $(this).css('attr')
を使用して取得しました
style.cssTextは、!importantを追加する唯一の方法です。
<script>
document.body.style.cssText='color: red !important;'
</script>
Bodyタグの変更は特定の十分な要素、クラス、または必要なものを作成するためのものではないため、コードのエラー(スペースを除く)が原因であまり機能していない可能性があります効果。
たとえば、検索結果のページテキストのクラスは「st」です。すべての検索結果は、それぞれ<li>
鬼ごっこ。
そのため、このような効果をもたらすコードは次のようになります。
var arr = document.getElementsByClassName('st');
for(i=0; i<arr.length; i++){
arr[i].style.color="green";
}
これだけを使用してください:
document.body.style.color="green";
このように重要なものを使用する必要はありません。とにかくFatalが指摘したように、CSSスタイルシートに直接重要なルールがある場合、これは機能しません。オーバーライドする必要があります。
そのように、スタイルシートを動的に作成し、頭の中でそれを広告する必要があります:
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));
}
次に、そのようにスタイルを更新できます
addNewStyle('body {color:green !important;}')