使用 jQuery 删除元素但保留文本答案

【问题标题】：Remove element with jQuery but leave text使用 jQuery 删除元素但保留文本
【发布时间】：2011-01-19 11:37:54
【问题描述】：

我有一些看起来像这样的 html：

<div>
    <span class="red">red text</span> some more text <span class="blue">blue text</span>
</div>

我想要做的是使用 jQuery 删除 div 中的所有跨度，无论附加类如何，但将跨度标签内的文本留在后面。所以最终的结果是：

<div>
    red text some more text blue text
</div>

我尝试使用unwrap() 方法，但它会打开 div。我也尝试删除元素，但删除了元素及其文本。

【问题讨论】：

【解决方案1】：

你不想解开 span，你想解开它的内容：

$("span").contents().unwrap();

对于早期版本的 jQuery，您可以执行以下操作：

$("span").replaceWith(function () {
    return $(this).text();
});

【讨论】：

来自文档：从 DOM 中删除匹配元素集的父元素，将匹配元素留在原处。 所以我想这就是它应该如何工作的。如果有办法选择文本节点，那么您可以使用 unwrap。
实际上似乎不起作用，只是在上面的示例 HTML 上试了一下。编辑：我使用的是 1.3.2，猜测升级时间！
Erik，确保您使用的是 jQuery 1.4+
它删除所有跨度标签：P
@harshitgupta 它应该只是用它们的内容替换标签。我刚刚再次检查了演示，它似乎像宣传的那样工作。您是否正在完全丢失内容？

【解决方案2】：

一个简单的$('#my-div').text ($('#my-div').text ()) 就够了，不用解包吗？

【讨论】：

【解决方案3】：

$(mydiv).html($(mydiv).text())

应该可以解决问题。

【讨论】：