14

jQuery pushStack関数（http://api.jquery.com/pushStack/に記載されています）を理解するのに問題があります。このフィドルのセレクターにアイテムのリストを追加しようとしました。

http://jsfiddle.net/johnhoffman/hTh8D/

JS：

$(function() {
   var listStuff = $("p");
   listStuff.pushStack($("div"));
   listStuff.css("color", "#f00");        
});​

HTML：

<p>foo</p>
<div>bar</div>​

ただし、div要素のテキストは赤ではありません。要素をjQueryスタックにプッシュするとはどういう意味ですか？

4

2 に答える 2

12

.pushStack()以前のjQueryオブジェクトから状態を継承する新しいjQueryオブジェクトを作成します。

この継承された状態により、.end()およびのようなメソッドが.self()適切に機能するようになります。.pushStack()特定のコード例では、新しいjQueryオブジェクトの戻り値を使用していません。

jQueryオブジェクトを操作する場合、jQueryオブジェクト内のDOMオブジェクトを変更するほとんどの操作は、既存のjQueryオブジェクトを変更するのではなく、変更された新しいjQueryオブジェクトを返すことを知っておくことが重要です。以前に変更されたjQueryオブジェクトのこのスタックを維持できるのは、この設計上の特徴です。

あなたの場合、私はあなたが使用する必要はまったくないと思います.pushStack()、そしてあなたはおそらくただ使用することができます.add()（これは新しいjQueryオブジェクトも返します）が、あなたが何をしようとしているのかは私には正確にはわかりません。推奨するコードが正確にわからない。

質問で示した最終結果のHTMLを実現するには、次のようにします。

$(function() {
   $("p").add("div").css("color", "#f00").appendTo(document.body);        
});​

明らかに.appendTo()、新しいDOMオブジェクトで実行しようとしているものに変更することができます。

あなたのコメントでは、いつ使用するかについてもう少し質問しましたpushStack()。主な用途は、新しいjQueryオブジェクトを返すjQueryメソッドであると思います。その場合、新しいjQueryオブジェクトに必要な要素の新しいリストを作成し、それを通常のjQueryオブジェクトに変換して返すのではなく、を呼び出しますreturn this.pushStack(elems)。これにより、新しいjQueryオブジェクトが作成されて返されますが、その新しいオブジェクトが前のオブジェクトにリンクされるため、のような特別なコマンド.end()をチェーンで使用すると機能します。

jQuery.add()メソッドは典型的な例です。擬似コードでは、これは次のようになります。

add: function(selector, context) {
    // get the DOM elements that correspond to the new selector (the ones to be added)
    // get the DOM elements from the current jQuery object with this.get()
    // merge the two arrays of elements together into one array
    return this.pushStack(combinedElems);
}
于 2012-04-17T19:28:57.430 に答える
1

オブジェクトをプッシュしていません。これを試してください：

$(function() {
var listStuff = $("p");
listStuff.css("color", "#f00");        
this.pushStack( listStuff.get() );
});​
于 2012-04-17T19:26:45.577 に答える