2

jQueryで要素の子を見つける最善の方法は何かと思っていますが、「検索」に親も含めます。

これが私の単純化された基本的な HTML セットアップです。

<div id="container">
    <form id="form1"> <!-- form 1 content --> </form>
    <form id="form2"> <!-- form 2 content --> </form>
</div>

そして、私はこのような機能が欲しい...

function getForms ($container) 
{
    // Option 1
    var $allForms = $container.find('form').andSelf().filter('form');

    // Option 2
    var $allForms = $container.find('form');
    if ($container.is('form')) $allForms.add($container);

    // Should return all the forms in the container if passed $('#container')
    // Or return just one form if passed $('#form1')
    return $allForms;
}

私は、オプション 1 または 2 の両方が機能することを確信しています。上記のどのオプションがより効率的か知っている人はいますか? よりエレガントまたはより効率的な他のオプションはありますか?

編集:オプション 2 の.is() には満足できませんでした。コンテナーに複数の jQuery オブジェクトが含まれていると機能しなかったからです。だから私はこのようなものを思いついた：

// Option 3
function getContainerElements ($container, selector) {
    return $container.find(selector).add($container.filter(selector));
}

あまりテストしていませんが、すべての一般的なケースで機能すると思います。

4

1 に答える 1

1

JSPerf テストによると、オプション 2 の方が優れています (Linux 上の Chrome でテスト済み)。

別のブラウザーで試してみたい場合は、ここで結果とテストを確認できます: http://jsperf.com/children-and-self

注: フォームの代わりに div を使用するようにこのテストを更新しました (他のフォーム内のフォームは機能しないため:フォーム内のフォーム、大丈夫ですか? )。取得するために親を追加する必要があるケースをテストしたい以下のコメントによる実際のパフォーマンスへの影響

ここに画像の説明を入力

編集

コメントで要求された 3 番目のオプションのパフォーマンスを追加

于 2012-10-26T21:08:12.397 に答える