jQueryの/ JavaScriptの最適化

Question

$("#mySelect").change(function() { 

    var myVar = $('#MyDiv'); 

    for (var i=0;i<this.value;i++) 
    { 
    myVar.clone().appendTo('#formContainer'); 
    } 
}); 

読みやすさやパフォーマンスへようこそ任意の改善が

Answer 1

私は@Diodeusに同意します.HTML文字列を作成して、一度に追加してください。これを試して。

$("#mySelect").change(function() { 
    var myVar = $('#MyDiv'), 
     html = [], 
     count = parseInt(this.value, 10), 
     myDivHTML = $('#MyDiv').wrap('<div />').parent().html(); 
    for (var i = 0; i < count; i++){ 
    myVar.push(myDivHTML); 
    } 
    $('#formContainer').append(html.join('')); 
}); 

Answer 2

DOMの再書き込みは最も高価です。あなたのHTMLをメモリ（または文字列）に構築し、ループの後にそれを挿入してください。

Answer 3

ここでは、（それは私がどうなるかだ）、次のとおりです。

$("#mySelect").live('change', function() { 
    var html = $('<div />').append($('#my-div').clone()); 
    for (var i = 0; i < this.value; i++) { 
     html.append(html.clone()); 
    } 
}); 

私は右だ場合、あなたは、各反復でdivの中に巣クローンしようと...私には奇妙に思われる...また使用live('change', ...);をトリガーにバインドすることができます。この場合、コードは最初のHTMLでロードされるだけでなく、AJAX経由でロードされるためにも機能します。