javascript - DOM要素をどのようにキャッシュしますか？

Question

$('#Counter')「毎回DOMに飛び込む」ので、何度も参照するのは悪い考えだと理解しています。

しかし、これはもっと良いですか？

Counter = $('#Counter');

そして、ループの内側：

Counter.val()++

編集：

上記のスニペットの修正。次のようになります。

Counter.val(Counter.val()+1);

それとも同じことをしているのですか？

Answer 1

説明したケースでは、このオブジェクトを繰り返し使用する反復ステートメントに入る前に、jQueryオブジェクトを変数に保存することをお勧めします。反復ごとにDOMツリーをトラバースすることを防ぎます。さらに、IDで検索することは無意味ですが、クラス名でクエリを実行したり、複合セレクターを使用したりすると、パフォーマンスが十分に低下する可能性があります。

var $Counter = $("#Counter");
for (...) {
    $Counter.val(function(i, val) { return +val + 1; });
    ...
}

この場合、引数として関数を使用するval()方が合理的であることに注意してください。