仅删除DOM JQuery中的父元素

我的想法快用完了。这里有一个问题，我需要只删除父元素，同时保留子元素。

<div class="remove_this_only">
    <table>
        <tbody>
            <tr>
                <td>I want to get preserved</td>
            </tr>
        </tbody>
    </table>
</div>

结果输出应该是

<table>
    <tbody>
        <tr>
            <td>I want to get preserved</td>
        </tr>
    </tbody>
</table>

编辑：

听起来你想删除添加到问题中的<div>。

只需选择<table>并使用unwrap()^[docs]方法。

$('div > table').unwrap();

当然，选择器将根据您的实际标记而变化。

示例：http://jsfiddle.net/VyJv3/（样式div已删除）

原始答案：

按照这种方式，您将删除一个表所需的元素。

如果您希望删除<td>，那么您将有一个文本节点作为<tr>的子节点。你可以做到。

如果你的HTML是这样的：

<html>
<table>
    <tbody>
        <tr>
            <td><span>I want to get preserved</span></td>
        </tr>
    </tbody>
</table>

如果你想去掉<span>，你可以使用unwrap()^[docs]方法。

$('td > span').contents().unwrap();

一种直接的方法：

var div = $(".remove_this_only");
var tmp = div.children().clone();
var parent = div.parent();
div.remove();
tmp.appendTo(parent);

小提琴：http://jsfiddle.net/cb9sb/

我想我明白你的意思了。

我想这就是你想要的：

$("td").closest("table").unwrap();

一种方法是获取想要保留的内容，并将其附加到想要删除的元素的父元素。然后删除要删除的元素。

您可以克隆整个结构并保留您想要的部分：

$('html').clone().appendTo('tmp');

取div的内容，并将div替换为：

$(".remove_this_only").replaceWith($(".remove_this_only").html());

var inner = $(".remove_this_only").html();
var parent = $(".remove_this_only").parent();
$(".remove_this_only").remove();
parent.append(inner);

实际答案：

http://jsfiddle.net/morrison/PqDCH/
http://jsfiddle.net/morrison/PqDCH/3/
http://jsfiddle.net/morrison/PqDCH/4/

//option 1
var $table = $('table');
$table.parent().before($table).remove();
//option 2
var $toRemove = $('.remove_this_only');
$toRemove.before($toRemove.children()).remove();
//option 3
$('table').unwrap();

注意：

append、before和其他一些jQuery函数会自动进行"分离"
这些都很短，这让它们非常棒

Detach（）不适用于您的情况？

http://api.jquery.com/detach/

您也可以使用html（）方法来提取源代码。

算法：

分离内部块
删除要销毁的块
将内块固定在适当的位置

注释中提到的标记为答案的解决方案不准确。。

以下是获取第一个子项和替换父项的精确解决方案与子

var child = $("#entry-longdesc").children().first().clone();
$("#entry-longdesc").replaceWith(child);

这只会删除父标记并保留子dom，因为它是

一个非常简单的解决方案是unwrap（）jQuery方法，在要删除的父元素中添加一个选择器。所以在你的情况下：

$('table').unwrap('.remove_this_only');

注意：如果不添加".remove_this_only"选择器，它可能会打开比您想要的更多的父元素。或者，如果您希望确保仅在'.remove_this_only'元素中专门针对"table"元素，则可以执行以下操作：

 $('.remove_this_only').find('table').unwrap('.remove_this_only');

相关内容

最新更新

热门标签：