15

jQueryの.after()が、それを使用して作成した新しい要素をチェーンまたは「提供」しない理由に興味があります。私にはそうあるべきだと思われますが、私は専門家ではなく、なぜそれが悪い考えであるかについて誰かが光を当てることができることを望んでいました。.after()から何が欲しいかを確認する例を次に示します。

ここにいくつかのマークアップがあります:

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

これが私が欲しいものですが、これは「Hello」を「World!」に置き換えます。

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

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

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

これはもっといいですが、私は完全に売られているわけではありません:(多分私はそうあるべきですか?)

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

これは明らかに単純化された例であることに注意してください。つまり、「<p> World!</ p>」は私が追加したいものではなく、私の現実世界の問題はそれよりも複雑です。

考えてくれてありがとう。

4

3 に答える 3

22

おそらく.after()、最初に選択された要素に適用されるより多くのメソッドをチェーンできるようにするために機能します。

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

これにより、動作が他のメソッドと一貫性を保つため、元のオブジェクトを返すメソッドと他のオブジェクトを返すメソッドを覚えておく必要はありません。

$('#hello1')IDで選択しているため、この場合は1つの要素のみを選択しますが.after()、複数の要素の後にコンテンツを追加(複製)するために、多くの要素を含むjQueryオブジェクトに適用できることに注意してください。

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

その場合、私の意見では、チェーンコンテキストを元のjQueryオブジェクトとして保持することは間違いなく理にかなっています。

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

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

(適用されたjQueryオブジェクトも返しますが、「reverse」で挿入を行います。)

追加される要素を返す独自のプラグインメソッドを作成することもできますが、すべての標準メソッドとは逆に機能するため、混乱を招きます。

于 2012-06-20T07:04:49.707 に答える
3

これは、ほとんどの jQuery メソッドの場合とまったく同じです。jQuery は一貫性があり、元のオブジェクトを返す方がよいでしょう。

修正はこれです:

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

また:

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

あるいは:

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

<p>後者は、新しい要素から連鎖し続けるため、実際には優先される場合があります。

于 2012-06-20T06:55:04.967 に答える
0

常に要素を作成するとは限らないため、作成された要素は提供されません。要素が作成されたことをJQueryが検出するには、かなりの処理能力が必要になります。常に要素を返すようにする方がはるかに理にかなっています。エレメントウィッチが操作のターゲットでした。

于 2012-06-20T06:57:29.517 に答える