Question

我需要删除div中的所有文本 - 但不确定如何使用jQuery或vanilla JS正确执行此操作。首先，我考虑使用.empty，但也删除了我孩子的字符串。

这是正确的方法吗？我想删除的字符串是totaal：string。这是一个动态文本，所以我无法确定目标。

<span id="span2">Totaal: <em id="headercartsum">€925</em></span>

Answer 1

在这种情况下，您要删除span元素的第一个子节点，以便您可以

$('#span2').contents().eq(0).remove()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span id="span2">Totaal: <em id="headercartsum">€925</em></span>

或者如果要删除所有文本节点，则

$('#span2').contents().filter(function() {
  return this.nodeType == Node.TEXT_NODE;
}).remove()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span id="span2">Totaal: <em id="headercartsum">€925</em></span>

基于em。

类

$('.headercartsum').map(function() {
  return this.previousSibling;
}).remove()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span id="span2">Totaal: <em id="headercartsum" class="headercartsum">€925</em></span>

Answer 2

您可以按nodeType属性选择文本节点以及.remove()以删除它：

$('#span2').contents().filter(function() {
  return this.nodeType === 3; //select text node
}).remove();

<强> Working Demo

Answer 3

这样的事情：

$('#span2').html($('#span2>*'));

https://jsbin.com/boyebeyaxe/edit?html,js,output

Answer 4

选择直接子元素并将其作为唯一内容：

$(document).ready(function() {
    $("#span2").html( $("#span2").children() );
})

http://jsfiddle.net/kffj63zh/

删除父div中的所有文本 - 将字符串保留在子项中

4 个答案: