1

h2 でテキストのスタイルを設定する方法をユーザーに教えてもらいたいです。そんなこと知ってる

 $('h2').css({'color':'red'});

すべてのh2タグを通過して変更します

<h2 style="color: red;">This is the header</h2>

でも基本は変わらない

 <h2>something</h2>

のように見えます。たとえば、何かの周りに h2 タグを配置するように RTE に指示すると、jQuery が定義した赤いスタイルが得られません (ほとんどの場合)。

RTE によって設定された h2 が新しいスタイルを反映するように、jQuery が基本的な h2 を定義する CSS を変更できる方法はありますか?

ありがとう

4

2 に答える 2

3

jQuery の使用

次のように、要素を作成してstyleに追加する必要がありますhead。

// array containing our styles
var styles = [
    "h2 { color: red; }",
    "h3 { color: green; }"
];

// create the style element and concat the styles
$("<style>" + styles.join("") + "</style>").appendTo("head");

注: 配列を使用する必要はありません。複数のスタイルを簡単に追加できるようにするために追加しただけです。

jsFiddle のテスト ケースを参照してください。

ネイティブCSSStyleSheet.insertRuleの使用

.insertRuleネイティブメソッドを使用して、ルールをスタイルシートに挿入することもできます。

// get the last stylesheet
var sheet = document.styleSheets[document.styleSheets.length-1];

// get a reference to the insertRule function
// the addRule method is used in IE8 and older
var insertRule = sheet[sheet.insertRule ? "insertRule" : "addRule"];

// reuse the styles-array from the jQuery snippet
while (styles.length) {
    insertRule.call(sheet, styles.splice(0,1));
}

jsFiddle のテスト ケースを参照してください。

于 2013-07-03T18:51:18.450 に答える
0

DOM Level 2 インターフェイスを使用できます

sheet.insertRule("h2 {color: red;}", 0);

およびIEの場合：

sheet.addRule("h2","color: red;", 0);
于 2013-07-03T18:53:38.187 に答える