jQuery展开所选元素

Question

如何从DOM中删除元素，但仍然保留其内容？

我查看了.unwrap()，但它似乎删除了元素的父元素，而不管它的id或类是什么。

我想选择DOM中的任何元素并将其删除，但仍保留其子元素。我的结构与此类似。

<div class="remove-1">
   <div class="remove-2">

      <span>keep<h1>all</h1>this</span>

   </div>
</div>

我将使用它来删除" remove -1“元素

 $(".remove-2").unwrap(); // removes parent "remove-1".

但是我该如何删除" remove -2“元素呢?因为这个跨度并不总是存在的，而且它的父元素可能是我不想删除的另一个元素。

Answer 1

使用函数.detach()，当您需要将这些元素附加回DOM时，您将附加到DOM树。

请参阅文档：http://api.jquery.com/detach/

更新1:

如果要展开元素的内容，则需要选择元素的子元素并将其全部展开。

​

$('button').click(function() {
  $("#detach").children().unwrap();
});

#detach {
  background-color: red;
  padding: 10px;
}
span {
  background-color: blue;
  color: white;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1 id="detach">

  <span>KEEP</span>
  <span>Keep second</span>
</h1>

<button>Unwrap content of red element</button>

​