新しい<style>要素がIEで動作しません

現在、灰色のBODY背景を持つHTMLページがあります。今私はこれを上書きし、Javascriptを使ってこれを白に変更したいと思います。他の要素のパディングとマージンを変更したいと思います。私はinnerHTMLプロパティを使用してこれを達成しようとします。新しい<style>要素がIEで動作しません

IE7やIE8では新しく導入された要素を除いて、すべてが機能しています。しかし、FireFoxで動作します。

 <script> 
     // if using jQuery 
     $(document).ready(function() { 
     document.body.innerHTML = ' 
    <style type="text/css"> 
     body { 
     background-color: #FFFFFF 
     !important; } 
     #todayBirthdays, #weekendBirthdays, #noBirthdays, #todayJubileums, #weekendJubileums { 
padding: 0 !important; 
     margin: 0 !important; 
     } 
    </style> 
      <div style="text-align: left; background-color: #FFFFFF">' + 
     document.getElementById('WebPartctl00_SPWebPartManager1_g_7118b319_c5b0_4214_a46d_27131866cde3').innerHTML + 
     '</div>';` 
       }); 
      </script>

アドバイスをお願いします。

多くの感謝！

出典

2011-12-05 Kris Van den Bergh

あなたはむしろ文書全体のHTMLを再構築しようとするよりも、DOMを使用したい背景や他のスタイルを変更すると考えられていますか？ –

私はこれまでに見たコードの中で最高のものでした - > 'document.getElementById（ 'WebPartctl00_SPWebPartManager1_g_7118b319_c5b0_4214_a46d_27131866cde3'）' – ManseUK

Sharepointが大好きです:) –

なぜだけではなく、

$('body').css('background-color', '#fff'); 
$('#todayBirthdays, #weekendBirthdays, #noBirthdays, #todayJubileums, #weekendJubileums').css('padding', 0).css('margin', 0);

出典

2011-12-05 16:07:23

ありがとうMarc！魅力のように動作します。 –

<style>タグは<head>の中でのみ有効ですが、一部のブラウザでは他の場所でそれを尊重することができます。本体の背景やその他のプロパティをスクリプトで変更したい場合は、jQueryで適切な.css()メソッドを使用してください。

$(document).ready(function() { 
    $("body")css("backgroundColor", "#FFFFFF"); 
    $("#todayBirthdays,#weekendBirthdays,#noBirthdays,#todayJubileums,#weekendJubileums").css("margin", "0"); 
});

出典

2011-12-05 16:05:42

マイケル、フィードバックに感謝します。適切な解決策は$（ 'body'）でした。css（ 'cssText'、 'background-color：#ffffff！important'）;ところで、私は背景色を強制する必要があったので！ –

のjQueryのCSS財産ともaddclass方法を参照してください。これはあなたがやっていることよりずっと簡単です！

$('body').css({ backgroundColor: 'value1' }); 
$('#todayBirthdays, #weekendBirthdays, #noBirthdays, #todayJubileums, #weekendJubileums').css({ padding: 'valuex', margin: 'valuey' });

代わりにaddClassを使用してください。

.myClass { /* Some styling */ } 

$('#x, #y, #z').addClass(myClass);

出典

2011-12-05 16:08:12 mrtsherman

<html> 
    <head> 
    <style type="Text/css"> 
     body { background-color: #AAA; } 
    </stye> 
    </head> 
    <body> 
    <script type="text/javascript"> 
     var style = document.createElement('style'); 

     style.innerHTML = 'body { background-color: #F0F; }'; 
     // add any other styles inside this style element 

     document.getElementsByTagName('head')[0].appendChild(style); 
    </script> 
</body>

あなたは、あなたは以下を使用し、その後尋ねたものですインラインスタイルに追加するに立ち往生している場合は<body>と<head>

出典

2011-12-05 16:08:13

_（新しいスタイルタグを追加する方法を知りたい場合）_ –

への追加のデモ：

$("<style type=\"text/css\"> body{background-color: #FFFFFF;} #todayBirthdays, #weekendBirthdays, #noBirthdays, #todayJubileums, #weekendJubileums { padding: 0 !important; margin: 0 !important;} </style>").appendTo("Head");

これはあなたのスタイリングを資料。しかし、現実には、jQueryやjavascriptを使用する場合は、バックグラウンドの値を変更するだけです。

document.getElementByTagName(body).attribute(background-color)="#FFFFFF";

$("body").css("background-color", "#FFFFF");

出典

2011-12-05 16:46:48 CBRRacer

新しい<style>要素がIEで動作しません

答えて

関連する問題