javascript - 如何在jQuery中动态创建元素的深拷贝？

我想用jQuery动态生成8个新段落：

http://jsfiddle.net/johnhoffman/Dfydn/

但是，此jQuery片段仅向我的div中添加了一个段落（其中带有文本“ 7”）。

var attached = $("<p>");
var sandbox = $("#sandbox");

for (var i = 0; i < 8; i++) {
    // How come reseting attached works? attached = $("<p>");
    attached.html(i).appendTo(sandbox);
}​

HTML：<div id="sandbox"></div>​

我不想为循环的每个迭代运行attached = $("<p>");，因为我想利用原型设计模式-我想构建一个段落，然后更改其副本以防止每次都从头开始构建。如何制作动态创建的元素的深层副本？

最佳答案

您可以尝试一下。使用.clone()方法。同样，当您使用clone（）时，不需要.html（i）。因为clone返回jQuery对象，所以您甚至不需要在其周围包装$（）。

var attached = $("<p>");
var sandbox = $("#sandbox");

for (var i = 0; i < 8; i++) {
    attached.clone().appendTo(sandbox);
}

此外，如果要克隆事件处理程序，则应使用.clone（true）。有关clone()的更多信息，请参见http://api.jquery.com/clone/