2008-09-10 9 views
8

私はこれを行うには良い方法を理解できないようですが、単純なはずです。私はdivを追加したい要素があります。それから私はクローンして、その中間のdivに押し込む別の要素を持っています。ここに私が望んでいたことがあります:jQuery "after"セレクタ質問

$("#somediv > ul").after("<div id='xxx'></div>").append($("#someotherdiv").clone()); 

これは近いですが、それほどありません。これの問題は、 "追加"が元の "#somediv> ul"セレクタで動作しているように見えることです。この種のことは理にかなっていますが、私が望むものではありません。私が "後"で追加した中間divを最も効率的に選択して、 "#sootherotherd"をその中に入れるにはどうすればよいですか?

答えて

9

逆の言い方をして、insertAfter()を使用してください。

作業を終了した後にのみ、生成されたDOMノードをドキュメントに追加してください。

ノードが表示されたドキュメントに追加されると、ブラウザは変更をリッスンしてビューを更新します。表示されたドキュメントにノードを追加する前にすべての作業を行うと、ブラウザのパフォーマンスが向上します。

0

"後"で追加した中間divを最も効率的に選択して "#someotherdiv"を入れるにはどうすればよいですか?

@ Vincentのソリューションはおそらく同じ結果を得る最も速い方法です。何らかの理由であなたがafter()でのdivを追加する必要がある場合は、あなたが

.nextAll([expr])

Find all sibling elements after the current element.
Use an optional expression to filter the matched set.

だからあなたのJSを使用することができ、それを選択し、それを操作する必要が次のようになります。

$("#somediv > ul") 
    .after("<div id='xxx'></div>") 
    .nextAll('#xxx') 
    .append($("#someotherdiv").clone()); 
5

use insertAfter():

$("<div id='xxx'></div>").insertAfter("#somediv > ul").append($("#someotherdiv").clone())