如何将一个div的内容克隆到另一个div

Posted 2023-02-22

【中文标题】如何将一个div的内容克隆到另一个div

【英文标题】：how to clone content of a div to another div

【发布时间】：2011-04-29 11:53:50

【问题描述】：

我想使用 jquery 克隆将选定 div 的内容复制到另一个 div。 但我不想将它附加到任何地方

我的意思是当我们用 jquery 克隆一个 div 时（如果我错了，请纠正我）我们必须设置它的位置，它会动态创建一个显示的新分区。

但我想获取选定的div的内容并将其复制到另一个预设的div

【问题讨论】：

谢谢你们，这是我真正想要发生的事情jsfiddle.net/pahnin/c2p54/2

【参考方案1】：

var a = $('#selector').html();
var b = $('#selector').html(a);

不确定我是否理解正确，但我认为这就是你的意思:)

【讨论】：

这也可以写成：$('#selectorDestination').html($('#selectorSource').html());。避免声明变量。

我们唯一应该小心的是我们不应该在 html 中复制 id

@dustin 是的，那是一样的，但我想，因为他要求不要穿上 dom，“我不想在任何地方附加它”:) 这是最好的前进方式

【参考方案2】：

我不同意。克隆可以在不应用内容的情况下保存数据。

看这里：

http://www.jsfiddle.net/dactivo/FqffM/

var mylayer=$('.hello').clone();

这里你可以随意管理变量“mylayer”，它不在DOM中。

【讨论】：

当然，html() 是一个很好的方法，但是很高兴知道 clone() 可以在不包含在 DOM 中的情况下进行管理

Clone 也复制了容器元素，我认为@pahnin 不想要。

好的，我认为真正的问题是你不想设置它的位置。 html() 非常适合这个。

【参考方案3】：

$("#from").clone().appendTo($("#to"));

但它不会删除/隐藏主 DIV。要隐藏主 div，请执行以下操作：

$("#from").clone().appendTo($("#to"));
$("#from").remove();

【讨论】：

我认为你没有理解我的问题。

【参考方案4】：

$(".from").click(function () 
     $(".from").removeClass("CloneMe");
     $("#to").html('');
     $(this).addClass("CloneMe");
     $(".CloneMe").clone().appendTo("#to");

);

您可以在单击（或其他事件）时添加一个硬编码以克隆的类。在此示例中，有一个包含样式内容（div 等）的相同类名称列表 - 添加 .CloneMe 类，但首先删除该类以清空 div，以防用户选择不同的项目。 ) 为了安全起见，也可以删除任何 html。然后使用 (this) 应用类以避免抓取具有该类名称的所有项目，最后附加到 div。结果是用户可以选择具有该类名称的任何项目并将其填充到容器中。 - 我想为容器使用一个类可以让你在多个地方填充它。

---