Question

我正在使用jquery .remove函数从DOM中删除元素，但我想的是有什么方法可以从DOM中取回已删除的元素。

<div id="parent" style="border: 1px solid red; padding: 10px;">
     I am the parent div.
     <div id="child" style="border: 1px solid green; padding: 10px;">
           I am a child div within the parent div.
     </div>
</div>
<p>&nbsp;</p>
<input type="button" value="Remove Element">

我有上面的代码。当点击remove element按钮时，.remove用于删除child的{{1}}元素。是否可以使用jquery在不刷新整个页面的情况下取回已删除的元素？

Answer 1

您可以使用.detach()删除和添加元素，如下所示

//selector caching
var parent = $("#parent");

//removing the element and storing it in the parent's dataset
$(".remove").click(function() {
  if ($("#child").length) {
    parent.data("ref", $("#child").detach());
  }
});

//adding back the element by fetching it from the parent's dataset
$(".add").click(function() {
  var elem = parent.data("ref");
  if (elem.length) {
    parent.append(elem);
  }
});

动态添加/删除元素

1 个答案:

DEMO