Question

从下面的HTML我想删除div和H2标签，但使用jquery保留UL标签。

请告知我如何实现这个目标

<div class="row">
    <h2><asp:Literal ID="categoryTitle" runat="server"></asp:Literal></h2>
    <ul class="tree js-catTree" id="treeContainer" runat="server"></ul>
</div>

由于

Answer 1

您可以使用replaceWith()

$('.row').replaceWith(function() {
 return $('ul', this);
});

Working Demo

Answer 2

当我只是试图删除一个父元素（同时仍然保留孩子们）时，我偶然发现了这个页面 - 以防它对其他人有用，我发现unwrap正好是我需要。对我来说，这是一个简单的find-an-element-and -wwrap：

$('.target-child').unwrap();

然而，在这种情况下增加h2去除会使事情变得更加复杂：

$('.row h2').siblings('ul').unwrap().end().remove();

http://jsfiddle.net/t8uQ8/

上述内容应该更加优化，因为它不依赖于使用匿名函数创建和调用。

Answer 3

你可以使用jQuery detach()函数吗？

这将删除元素（直观地）但将其代码保存在变量中，然后您可以将其附加到另一个父元素中。

Answer 4

正如@Silvain所说，您可以detach将该元素保存到变量中。

var $ul = $('.row h2').siblings('ul').detach();

然后，您可以将ul插入其父级之后，然后从DOM中删除该父级：

$('.row').after($ul).remove();

删除父元素，但在HTML中使用jquery保留子元素

4 个答案: