1. ホーム
  2. javascript

[解決済み] Javascriptで<style>タグを作成するには?

2022-03-23 22:53:57

質問

を挿入する方法を探しています。 <style> タグをJavaScriptでHTMLページに挿入します。

今まで見つけた中で一番良い方法です。

var divNode = document.createElement("div");
divNode.innerHTML = "<br><style>h1 { background: red; }</style>";
document.body.appendChild(divNode);

Firefox、Opera、Internet Explorerでは動作しますが、Google Chromeでは動作しません。また <br> を前面に出すと、IEでは

を作成する方法をご存知の方はいらっしゃいますか? <style> というタグがあります。

  1. より良い

  2. Chromeで動作しますか?

あるいは

  1. これは、私が避けるべき非標準的なものである

  2. 3つの動作するブラウザは素晴らしいし、そもそもChromeなんて誰が使うんだ?

解決するには?

を追加してみてください。 style 要素を head よりも、むしろ body .

IE(7-9)、Firefox、Opera、Chromeで検証しています。

var css = 'h1 { background: red; }',
    head = document.head || document.getElementsByTagName('head')[0],
    style = document.createElement('style');

head.appendChild(style);

style.type = 'text/css';
if (style.styleSheet){
  // This is required for IE8 and below.
  style.styleSheet.cssText = css;
} else {
  style.appendChild(document.createTextNode(css));
}