从 dom 中删除 html 元素

Posted 2023-05-09

【中文标题】从 dom 中删除 html 元素

【英文标题】：Remove html elements from the dom

【发布时间】：2014-09-01 16:27:50

【问题描述】：

我正在尝试弄清楚如何使用 jQuery 在此处删除破折号和冒号。有办法吗？到目前为止，我已经尝试过.empty 和.remove，但很遗憾，我无法让它工作。

<p class="meta">
     <strong>Author Name</strong>
     –                                <-- remove this
     <time>June 7, 2013</time>
     :                                <-- remove this
</p>

【问题讨论】：

jQuery: how to remove the text but not the children elements 的可能重复项

【参考方案1】：

你可以使用...

$('.meta').contents().filter(function()  return this.nodeType == 3 ).remove()

jsFiddle.

【讨论】：

这是正确答案。只有在发布我自己的答案后，我才看到你的。

【参考方案2】：

试试这个：

$(function()
   var $children = $('.meta').children();
   $('.meta').empty().append($children);
);

Demo

【参考方案3】：

我建议重新创建你的 $(".meta") DOM 节点，所以你必须提取 strong 和 time，清空你的 $(". meta") 并插入以前存储的节点。

【参考方案4】：

您需要使用contents()，它返回所有子节点（包括文本节点）。然后使用remove() 删除那些文本节点。

http://jsfiddle.net/Pv3qX/

$(".meta").contents().filter(function() 
     return this.nodeType == 3; // 3 for TEXT_NODE
).remove()

【参考方案5】：

试试这个，

$(function()
   $('p.meta').html($('p.meta').find('*'));
);

Live Demo

或者试试，

$(function()
    $('p.meta').html(function() return $(this).find('*'););
);

Alternative

已更新，如果您的子元素附加了事件，请使用 contents 和 filter 之类的，

$(function()
    $("p.meta").contents().filter(function() return this.nodeType == 3; ).remove();
);

Demo

参考How can I change an element's text without changing its child elements?

【讨论】：

直接在这些元素上是否有事件监听器的问题。

【参考方案6】：

这里是解决方案：http://jsfiddle.net/E6GYs/

$(document).ready(function()
    $(document).click(function()
     $('.meta time').remove();
  )
    )