5

プロトタイプのDown()関数をよく使用していたプロトタイプからjqueryにwebappを移植しています。(特定の要素の最初の子を選択する)

これを行う方法の 1 つに JQuery-api をざっと見ると、次のようになります。

プロトタイプ: $('abc').down(); jquery: $('abc').children().first();

ただし、これは最初にすべての子をフェッチし、後でフィルターを適用するため、このユースケースでは効率的ではないと思います。

より良い方法は何ですか？

4

3 に答える 3

6

jQuery を拡張して、次のdown()ような関数を追加できます。

(function($) {
  $.fn.down = function() {
    return $(this[0] && this[0].children && this[0].children[0]);
  };
})(jQuery);

この方法では、コードを変更する必要はありません。

このライブjsFiddle の例を見ることができます。また、 jsPerf
でパフォーマンス比較を表示できます。 これは、他の回答で提示された方法よりも高速であることを示しています (40% から 70% 遅い)。

EDIT：
実際のプロトタイプの実装から適応された代替バージョン。これはさらに高速です (25%)

(function($) {
  $.fn.down = function() {
    var el = this[0] && this[0].firstChild;
    while (el && el.nodeType != 1)
      el = el.nextSibling;
    return $(el);
  };
})(jQuery);
于 2010-10-21T17:13:10.677 に答える
2

これを行うにはいくつかの方法があります。

まず、これは単一の要素を含む配列を返します。

$('form').children().first();

$('form').children(":eq(0)")また、これは;のより読みやすいバージョンであることにも注意してください 。

次に、これは配列から抽出された要素だけを返します

$('form').children()[0];

または、（要素のタイプに関係なく最初の子だけではなく）後の要素のタイプがわかっている場合は、次を使用できます。

$('form').find("input:first");

最後に、要素をその親に対して相対的に厳密に必要としない場合は、CSS3 セレクターを使用して直接アクセスできます。

$("input:first");

この最後のオプションは、回避できる場合に最も効率的であると思われます。しかし、誰かが効率についてもっと言いたいことがあれば、私はそれを聞きたい.

于 2010-10-21T16:27:29.727 に答える
1

試す：

$('abc').children(":eq(0)")
于 2010-10-21T16:09:03.900 に答える