附加对象而不是引用

Question

我正在尝试在 for 循环内的 div 中添加多个 div：

  for( i=0; i<10; i++ )
  {
      $('#parent').append('<div class="child"></div>");
  }

这非常有效，但是当我这样做时：

  for( i=0; i<10; i++ )
  {
      var child = $('<div/>', { class: 'child' });
      $("#parent").append(child);
  }

我得到的结果很奇怪，我相信是因为使用第二种方法，传递的是引用而不是对象本身。我怎样才能将纯对象而不是引用传递给 append 方法？谢谢！

Answer 1

使用jQuerycloning

$("#parent").append(child.clone());

您一遍又一遍地附加同一个对象，所以没有任何反应。它只是取出元素并将其放回原处。

克隆确保它是一个新对象，即原始对象的副本。

以上link:

Consider the following HTML:
<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">Goodbye</div>
</div>
... given the code:

$( ".hello" ).appendTo( ".goodbye" );

The resulting DOM structure would be:
<div class="container">
  <div class="goodbye">
    Goodbye
    <div class="hello">Hello</div>
  </div>
</div>
To prevent this and instead create a copy of the element, you could write the following:

$( ".hello" ).clone().appendTo( ".goodbye" );

This would produce:
<div class="container">
  <div class="hello">Hello</div>
  <div class="goodbye">
    Goodbye
    <div class="hello">Hello</div>
  </div>
</div>

附加对象而不是引用

Appending object instead of reference

jquery

append