pushStack(elements)


version 1.0 以降

解説

指定された要素集合と、元のjQueryオブジェクトへの参照を持つ、新しい jQuery オブジェクトを生成します。

主に開発者向けです。
jQuery内部では、Traversing の実装等で使用されています。

引数の形が2種類あります。

type1

引数

  • elements
    Array<Element>: 追加するDOM要素配列

戻り値

  • jQuery: jQuery オブジェクト
type2

引数

  • elements
    Array<Element>: 追加するDOM要素配列
  • name (version 1.3 から)
    String: この要素配列を生成した jQuery 関数名
  • arguments (version 1.3 から)
    String: jQuery関数に渡された引数 (シリアライズされたもの)

戻り値

  • jQuery: jQuery オブジェクト

例1:item2-1, item3-2 を持つjQueryオブジェクトを生成し、背景色を橙色にします。
元のjQueryオブジェクト(item1-1)に戻り、背景を黄色にします。

$("#item1-1")
    .pushStack([    // item2-1, item3-2 を持つjQueryオブジェクトを生成
        document.getElementById("item2-1"),
        document.getElementById("item3-2")])
    .css("background-color", "orange")
    .end()
.css("background-color", "yellow")

<div id="level1"> <span id="item1-1">Level1 1番目の要素</span>
<div id="level2"> <span id="item2-1">Level2 1番目の要素</span> <span id="item2-2">Level2 2番目の要素</span>
<div id="level3"> <span id="item3-1">Level3 1番目の要素</span> <span id="item3-2">Level3 2番目の要素</span> <span id="item3-3">Level3 3番目の要素</span> <span id="item3-4">Level3 4番目の要素</span> <span id="item3-5">Level3 5番目の要素</span> </div>
</div>
</div>

内部実装解説

jquery-1.4.2.js (Uncompressed) line215-239から抜粋し、コメントを付加
pushStack: function( elems, name, selector ) {
    // (1) --- 新しい jQuery オブジェクトの生成 ---
    // DOM 要素を持つ新しい jQuery オブジェクトを生成します。
    var ret = jQuery();

    if ( jQuery.isArray( elems ) ) {
        push.apply( ret, elems );
    
    } else {
        jQuery.merge( ret, elems );
    }

    // (2) --- 元の jQuery オブジェクトの参照を保存 (prevObject プロパティ) ---
    // 元の jQuery オブジェクト(this)を、生成した jQuery オブジェクトの
    // prevObject プロパティに保存します。
    // これは、end() メソッドで、1つ前の要素集合に戻るときに使用されます。
    ret.prevObject = this;

    // (3) --- context の設定 (context プロパティ) ---
    // 生成した jQuery オブジェクトの context プロパティに、
    // 元の jQuery オブジェクト(this) の context プロパティ を生成します。
    ret.context = this.context;

    // (4) --- selector の設定 (selector プロパティ) ---
    // selector プロパティを設定します。
    // この要素集合の生成に使用した セレクタを保存するためです。
    // そのため、第3引数は適切な形でシリアライズされている必要があります。
    if ( name === "find" ) {
        ret.selector = this.selector + (this.selector ? " " : "") + selector;
    } else if ( name ) {
        ret.selector = this.selector + "." + name + "(" + selector + ")";
    }

    // (5) --- 新しい jQuery オブジェクト を返す ---
    // 指定されたDOM 要素を持つ、新しい jQuery オブジェクトを返します。
    return ret;
},