4

jQueryは要素のコレクションをキャッシュしないことを知っています.f.ex呼び出し:

$('.myclass').html('hello');
$('.myclass').html('bye');

jQuery が DOM を 2 回登るようになります。

しかし、キャッシュされた DOM ノードはどうでしょうか?

var elems = document.querySelectorAll('.myclass');

$(elems).html('hello');
$(elems).html('bye');

jQuery はそれらを内部的にキャッシュしますか、それとも最初の例と同じように遅くなりますか?

明確にするために:jQueryは参照を保持して内部的elemsにキャッシュするので、毎回$(elems)同じラッパーを適用する必要はありませんか?$()

何かのようなもの:

cache = {}
constructor = function(collection)
    if collection in cache
        return cache[collection]
    else construct(collection)
4

2 に答える 2

12

私があなたの質問を正しく理解していると仮定すると、いいえ、jQuery はそれらを使用するステートメントを超えて選択されたノードへの参照を保持しません:

$('.myclass').html('hello'); //Select all .myclass elements, then change their HTML
$('.myclass').html('bye'); //Select all .myclass elements, then change their HTML again

選択したノードへの参照を個別に維持すると、より高速になります。

var elems = document.querySelectorAll('.myclass'); //Select all .myclass elements
$(elems).html('hello'); //Change their HTML (no need to select them)
$(elems).html('bye'); //Change their HTML (no need to select them)

違いはそれほど大きくありませんが (DOM が非常に複雑でない限り)、次のような違いがあります。

ここに画像の説明を入力


アップデート

jQuery は elems への参照を保持し、$(elems) を内部的にキャッシュするので、毎回同じ $() ラッパーを適用する必要はありませんか?

いいえ、そうはなりません。前述のように、一致した要素のセットへの参照は、それが適用されるステートメントを超えて維持されません。全体で使用される jQuery オブジェクトへの参照を保持することで、毎回それらを再度選択したり、格納されたネイティブ DOM ノードのセットを毎回 jQuery オブジェクトにラップしたりすることで、コードのパフォーマンスを向上させることができます。

于 2012-09-05T07:55:38.530 に答える
0

「キャッシュ」が「そのjQuery オブジェクトの内部コレクションに DOM 要素を保持する」ことを意味する場合は、はい。

想像

jq = $(elementListOrSelector)

wherejq[0..jq.length-1]は、それぞれの DOM 要素に評価されます。たとえばjq[0]、jQuery オブジェクトによって表される最初の DOM 要素があれば、それを評価します。このコレクションは、いったん構築されると、魔法のように変更されないことに注意してください (構築方法は重要ではありません)。

ただし、その特定のjQuery オブジェクトの即時の結果を単に保持する以外に「キャッシュ」はありません。

于 2012-09-05T07:54:02.120 に答える