jQuery / javascript优化

Question

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

  var myVar = $('#MyDiv');

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

欢迎提高可读性或性能

Answer 1

DOM重写是最昂贵的。 在内存中（或作为字符串）构建HTML，然后将其插入到循环之后。

Answer 2

我同意@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 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加载。