☰

実行時にjQueryを使用してCSSルール/クラスを作成する 質問する

tag-icon • tag-icon jquery css
実行時にjQueryを使用してCSSルール/クラスを作成する 質問する

通常、次のルールを持つ CSS ファイルがあります。

#my-window {
    position: fixed;
    z-index: 102;
    display:none;
    top:50%;
    left:50%;
}

実行時のアクション中に CSS 情報を本体に追加するなどして、このような静的 CSS ファイルの作成を回避するにはどうすればよいですか? (jQuery のみを使用)

これを一度 jQuery で定義し、後で何度も使用したいので、特定の DOM 要素に毎回追加したくありません。

シンプルな機能 ( css("attr1", "value");) はわかっていますが、完全に再利用可能な CSS ルールを作成するにはどうすればよいでしょうか?

ベストアンサー1

スタイル要素を作成し、DOMに挿入することができます

$("<style type='text/css'> .redbold{ color:#f00; font-weight:bold;} </style>").appendTo("head");
$("<div/>").addClass("redbold").text("SOME NEW TEXT").appendTo("body");

Opera10 FF3.5 iE8 iE6でテスト済み

おすすめ記事