javascript - jquery 仅克隆元素的内容

Question

jQuery中有没有办法克隆元素的内容？不是整个元素，只有内容（子元素）。

类似于.html()正在做的事情，但我也对克隆附加到内容的事件感兴趣。

我在看.clone，但似乎正在克隆整个元素。

谢谢。

Answer 1

Doua Beri，参考jQuery API 文档，.clone()你会发现你想要的是.clone(true,true). 这将制作一个元素（或元素集合）的深层副本，包括所有数据和事件绑定。

然后，您可以从两个选项中选择如何使用.clone(true,true).

1. 单独克隆孩子以提供包含孩子克隆的 jQuery 集合。

   var $childClones = $("#myElement").children().clone(true,true);

2. 克隆外部元素以提供一个包含外部元素克隆的 jQuery 集合，该集合本身包含子元素的克隆。

   var $clone = $("#myElement").clone(true,true);

您采用哪种方法有点学术性。在这两种情况下，后代元素都可以集体或单独地被操作和/或插入到 DOM 中，尽管这样做的代码会略有不同。

Answer 2

如果你喜欢深拷贝，只需克隆孩子：

$('#footer-flair').children().clone()

而不是将事件附加到特定元素，而是将事件附加到正在侦听子元素的容器元素，这样只要容器元素保持不变，即使您在容器内添加/删除一千个元素，您的事件也会触发。如果您不想让您的事件消失，您可以在 body 标签上执行此操作。

使用 'on' 方法来绑定事件，如下所示：

$('body').on('click', 'button.className',  function(){
  alert('button clicked');
});