JQueryで動的に追加されたDOMノードがCSSファイルで定義されたスタイルを使用しないという問題があります。動的に追加されたJQueryがCSSスタイルを失う(しない)CSSスタイル
私は周りを見回して、the answers I've seen、問題を解決しないでください。つまり、関連するCSSはホストページとの相対的なパスにあります。それは確かに記憶にある。しかし、A)またはB)を使用すると、追加またはロードされた 'newNode'は既に読み込まれているスタイルを使用しません。
A)$("#some-selector").append(newNode);
B)$("#some-selector").load("/path/to/newNode.html");
私は手動で
Cのようなスタイルを追加することが必要であることを見つける)$(".loadedElement").css('some-style','some-value');
は、誰もがこれを解決していますか?
ありがとうございます。
--- EDIT
私はもう少しだ。私はA)のようなHTMLとBのようなCSSを持っていました。ネストされたCSSセレクタが私が望むノードに一致していないことが判明しました。私はC)のようにセレクタに行ってしまいました。私の動的ノードにはスタイルが適用されています。しかし、私は本当にB)のようなものを持つことを好むでしょう。私のCSSはオフですか?
A)
<div id='6bullet-container'>
<input id='six-bullet-image-upload' name='convert' type='file'>
<div class='six-bullet-content-wrapper'>
<div class='six-bullet-container-label'>
click to upload
</div>
<div id='six-bullet-title'></div>
<div class='six-bullet-bullet' id='six-bullet-one'></div>
<div class='six-bullet-bullet' id='six-bullet-two'></div>
<div class='six-bullet-bullet' id='six-bullet-three'></div>
<div class='six-bullet-bullet' id='six-bullet-four'></div>
<div class='six-bullet-bullet' id='six-bullet-five'></div>
<div class='six-bullet-bullet' id='six-bullet-six'></div>
…
B)
#6bullet-container #six-bullet-image-upload .six-bullet-content-wrapper .six-bullet-bullet {
my: style;
}
C)
.six-bullet-bullet {
my: style;
}
要素がDOM内でどのようになるかは関係ありませんが、同じスタイルが適用されます。 CSSセレクタに合った新しい要素にはいくつかの問題がありますが、要素もCSSも提供していないので、私はあなたを助けません。私はあなたがHTMLに直接コード化された要素が適切なスタイルを取得することを確認したと思いますか? –
@amnotiamはCSSセレクタについては正しいです。あなたのHTMLを$( "#some-selector")に入れる時までに、スタイルはコアではなく、$( "#some-selector" newNode.html "、function(data){console.log(data)});あなたがサーバから得たものを正確に見るために – Liviu
ちょうどの場合のあなたのCSSを私たちに見せることができますか? – MMM