Question

我需要克隆一个div然后将它附加到另一个位置。 DIV看起来像这样。

<div id="clonableContet" class="clonableClass">
<input id="Name" class="clonableInput" type="text"/>
<input id="Age" class="clonableInput" type="text"/>
</div>

<div id="clonedContentHolder"></div>

如果我克隆clonableContent并将其附加到clonaedContentHolder，则它包含相同的ID 和前一个一样。我想动态更改克隆的内容div's id属性。但我能够动态地向克隆的input元素添加新的类名。我很擅长。我将能够通过一些类名引用获取值。

但我的问题是我想让最后克隆的内容可见。因为，所有这些div's都是标签内容。我无法更改clonableContent div的ID。

我试图动态创建另一个div，并将克隆的div放入其中。像这样，

var html = "<div id='clonedContent" + count + "'>" + clonedContent + "</div>";

但输出是[Object] [Object]。 cloned div，becames中的对象。

如何将clonedContent作为另一个字符串插入字符串中？

或者，是否有其他方法可以获得相同的解决方案。

提前致谢。

Answer 1

创建html：

var html = $("<div />").attr('id', 'clonedContent'+count).html(clonedContent);

然后你可以使用html作为jquery对象并追加到最后一项：

html.appendTo('div:last');

Answer 2

我发现这样做的最好方法是append现有jQuery对象的对象：

var html = $("<div id='clonedContent" + count + "' />").append(clonedContent);

Answer 3

非JQuery解决方案：

var div = document.createElement("div"); //create a new div
div.id="clonedContent" + count; // set the id with your counter
div.appendChild(clonedContent); //add the DOM reference you have
document.getElementById("clonedContentHolder").appendChild( div ); //add the content to div on page

如何在HTML标记字符串中插入克隆元素？

3 个答案: