私は、この「非効率的なjQueryの使い方」を理解しない

Question

PyCharmは、次のコードについてはこちらを言います。このコードの

$('#popup-key input:eq(18)').val(key.labelcolor); 
$('#popup-key input:eq(19)').val(key.color); 

同じ：あなたが同様のクエリをたくさん作り、:eq()セレクタをたくさん使っている

var i; 
for (i = 0; i < 9; ++i) { 
    var value = $('#popup-key input:eq(' + (i * 2) + ')').val(); 
    var size = $('#popup-key input:eq(' + (i * 2 + 1) + ')').val() || defaultSettings.f; 
    if (value.trim() != '') { 
     clone.labels.push(new Label(value, inputToPositions[i], size)); 
    } 
} 

Answer 1

ストア

var $input = $('#popup-key input'); 

$input.eq(18).val(key.labelcolor); 
$input.eq(19).val(key.color); 

//etc.. 

Answer 2

私は、これが効率的に作ることができる方法を知ってはいけません。単一のクエリを作成し、結果を反復処理する方が効率的です。これは、クエリを実行するたびにセレクタ文字列を解析し、そのセレクタに一致する要素のドキュメント全体をチェックする必要があるためです。一度だけクエリを行うことにより

$('#popup-key input').each(function(el, i) { 
    $(el).val(); 
}); 

、each()機能はすでにそれが不要な選択をしなければならないに対処していないために必要なものの要素を知っているだろう。冗長なクエリを排除できる場合はいつでも、スクリプトをより効率的にすることができます。