2012-06-20 8 views
14

jQueryの.after()が、それを使って作成する新しい要素を連鎖させない、または「提供しない」のが不思議です。それは私のように思えるはずですが、私は専門家ではなく、なぜ誰かがそれが悪い考えであるかどうかを明らかにすることを望んでいました。ここで)(私は.afterから希望のものを参照するには例です:ここではjQuery .after()が新しい要素を連結しないのはなぜですか?

は、いくつかのマークアップは次のとおりです。

<div id="content1"> 
    <p id="hello1">Hello</p> 
</div> 
<div id="content2"> 
    <p id="hello2">Hello</p> 
</div> 

は、ここで私が何をしたいのですが、これはとの「Hello」置き換え「世界!」:

$('#hello1').after('<p />').text('World!'); 

これは仕事をしていませんが、それは確かに醜いです:

$('#hello2').after('<p />'); 
var $newParagraph = $('#content2 p').last(); 
$newParagraph.text('World'); 

これは立派ですが、私は完全に販売していないよ。(多分私はshoul d?)

$('#hello1').after($('<p />').text('World')); 

注これは明らかに単純化した例であり、それは、「<P>の世界です! </P >は「私の現実世界の問題は、それよりも複雑で、私は追加したいものではありません。任意の考えについて

感謝。

+0

あなたの期待どおりの結果は? –

+0

だから誰もあなたがafter()経由で追加する要素を取得する最良の方法を知っていますか? – Tim

答えて

20

おそらく.after()作品は元々、選択した要素(複数可)に適用されるチェーン複数のメソッドにあなたをできるようにして:あなたがいないので、これは他の方法と一貫した動作を保つ

$('#hello1').after($('<p />').text('World')) 
      .before($('<p />').text('Before text')) 
      .remove(); 

どのオブジェクトが元のオブジェクトを返し、何らかの他のオブジェクトを返すかを覚えようとする必要があります。

$('div.someclass').after($('<p/>').text('whatever')); 

:あなたはIDによって選択されていますが、複数の要素の後に(クローン化)コンテンツを追加するために多くの要素を含むjQueryオブジェクトに.after()を適用することができますので、あなたのケースで$('#hello1')は正確に一つの要素を選択することを

注意この場合、私の意見では、チェーン・コンテキストを元のjQueryオブジェクトとして保持することは間違いありません。

.insertAfter() methodはあなたが望むものに近いかもしれません:

$('<p/>').insertAfter('#hello1').text('World'); 

(。また、jQueryのは、それが適用されたオブジェクトが、それは「逆」に挿入を行い返します)

あなたは可能性があり追加される要素を返す独自のプラグインメソッドを記述しますが、それはすべての標準メソッドとは逆に動作するので混乱します。

+0

うん、私は売れている、それらの面白いものの一つに出くわす。ありがとう:) – Bung

+1

'.insertAfter'の例で' hello1'をラップする必要はありません。 – Alnitak

+0

良い点@Alnitak - 回答が更新されました。 – nnnnnn

3

それが最もjQueryのメソッドのためにどれだけだこと。これは、jQueryのためのより良いです一貫して、元のオブジェクトを返します

修正はこれです:。

$('#hello1').after(
    $('<p/>', { text: 'World!' }) 
); 

か:

$('#hello1').after(
    $('<p/>').text('World!') 
); 

あるいは:それは、新しい<p>要素からチェーンに進みないので

$('<p/>').text('World!').insertAfter('#hello1'); 

後者は、実際には好ましいかもしれません。

+0

ありがとう、意味がある、私はそれがより冗長なタッチだから、他の答えを選んだが、これは同じである。 – Bung

+0

良い答えのための@Bung upvotesはまだ評価されています... – Alnitak

0

常に要素を作成するとは限らないので、作成された要素は提供されません.JQueryが要素が作成されたことを検出するには相当な処理能力が必要です。要素の魔法使いを操作の対象に戻すようにしてください。