より効率的なjquery

Question

このコードは動作しますが、ブラウザの種類がちょっと変わってしまいます。大事なことはありません。これをより効率的にする方法があるのだろうかと思います。キャッシュを使用したり、何らかの選択をしてから別の5にコピーしたりすることはできますか？（ページには「マスク」クラスのドロップダウンが6つあります）

ご協力いただければ幸いです。

$('.mask').each(function() { 
    $(this).append($('<option/>').val("").text("")); 
    for (var i = 1; i < 256; i++) { 
     $(this).append($('<option/>').val(i).text(i)); 
    } 
    }); 
}); 

Answer 1

あなたはこのように、それらのクローンを作成一旦ノードを作成することができます

var temp = $('<select/>'); 
$('<option/>').val("").text("").appendTo(temp); 
for (var i = 1; i < 256; i++) { 
    $('<option/>').val(i).text(i).appendTo(temp); 
} 
temp.children().clone().appendTo('.mask'); 

をする代わりに、個々の多くを行うのは、これはすべての要素をアップバッチ（これは非常に高価である）DOMに追加しますドキュメントフラグメント内にコピーし、バッチで追加します（選択ごとに1つのバッチ）。

Answer 2

（hereテストとして、3-10回程度）これは、単一の文字列にHTMLを自分で構築することがはるかに高速です：http://jsperf.com/appending-options-jquery

：このスレッドの現在のオプションを比較

var html = "<option value=''></option>"; 
for (var i = 1; i < 256; i++) { 
    html += "<option value='" + i + "'>" + i + "</option>"; 
} 
$(".mask").append(html); 

参照性能試験