Javascript Jquery删除innertext，但保留html

我有这样的东西

<div id="firstDiv">
    This is some text
    <span id="firstSpan">First span text</span>
    <span id="secondSpan">Second span text</span>
</div>

但它不起作用

是否有一种方法可以获取（或者可能通过类似

.text（“”）的方式删除）

标记中的自由文本，而不是其子标记中的文本

---

非常感谢。

筛选出文本节点并将其删除：

$('#firstDiv').contents().filter(function() {
    return this.nodeType===3;
}).remove();

要对文本本身进行过滤，您可以执行以下操作：

$('#firstDiv').contents().filter(function() {
    return this.nodeType === 3 && this.nodeValue.trim() === 'This is some text';
}).remove();

要获取文本，请执行以下操作：

var txt = [];

$('#firstDiv').contents().filter(function() {
    if ( this.nodeType === 3 ) txt.push(this.nodeValue);
    return this.nodeType === 3;
}).remove();

看看这个

假设您有这个html

<parent>
  <child>i want to keep the child</child>
  Some text I want to remove
  <child>i want to keep the child</child>
  <child>i want to keep the child</child>
</parent>

检查此项以获得html的解决方案

var child = $('#firstDiv').children('span');
$('#firstDiv').html(child);

---

PS：请注意，当您删除并重新创建元素时，该div上绑定的任何事件处理程序都将丢失

为什么要强制jQuery执行此操作呢

var div = document.getElementById('firstDiv'),
    i,
    el;

for (i = 0; i< div.childNodes.length; i++) {
    el = div.childNodes[i];
    if (el.nodeType === 3) {
        div.removeChild(el);
    }
}

var div=document.getElementById（'firstDiv'），
我
el；
对于（i=0；i

---

在这里拉小提琴：

看看这个，不确定它是否完全符合你的要求。。。注意：我只在chrome上测试过

cleartext（$（'firstDiv'）；
函数明文（节点）{
var children=$（node.children（）；
如果（children.length>0）{
var newhtml=“”；
children.each（function（）{
明文（$（本））；
newhtml+=$（''）.append（this.html（）；
});
$（node.html（newhtml）；
}
}

Answer here:可以尝试使用.val（“”）代替.text（）。@Happycoder仍然不起作用：（指出代码中的问题-您正在克隆元素（这将创建一个新的独立元素）首先，然后在克隆上执行操作，这不会影响原始元素。它可能在该分区的任何位置重复，同时您正在重新创建所有元素，因此所有数据、事件处理程序等都将丢失。我不会说这更简单（如果你看看adeneo的

.filter

解决方案，它只需要编写更少的代码），但它肯定也不是很难。@FelixKling-这是真的。但它比发布的一些jQuery解决方案简单得多。

.html

（和

.innerHTML

）的问题这就是浏览器解析HTML字符串并从中创建新元素的方法。如果您使用新元素，这没关系。但是如果您将现有元素转换为HTML，然后将HTML设置为“重新创建”这些元素，您将释放所有绑定到这些元素的事件处理程序和数据。当然，这不是一个完美的解决方案，但是由于OP在剥离之前没有提到将事件绑定到这些元素，所以我认为值得一试，看看我脑海中突然出现的想法是否可行。

var child = $('#firstDiv').children('span');
$('#firstDiv').html(child);

var div = document.getElementById('firstDiv'),
    i,
    el;

for (i = 0; i< div.childNodes.length; i++) {
    el = div.childNodes[i];
    if (el.nodeType === 3) {
        div.removeChild(el);
    }
}

cleartext($('#firstDiv'));

function cleartext(node) {

    var children = $(node).children();
    if(children.length > 0) {

        var newhtml = "";
        children.each(function() {

            cleartext($(this));

            newhtml += $('<div/>').append(this).html();

        });

        $(node).html(newhtml);

    }
}