如何从DOM中删除特定的文本节点

Question

我正在尝试删除文本节点“ one ”。

$ targetDiv是jQuery对象

$targetDiv[0].outerHTML
<div><div>one<font face="Impact" size="4">www</font></div></div>

$targetDiv[0].innerHTML
<div>one<font face="Impact" size="4">www</font></div>

我可以删除另一个文本节点“ www ”，如下所示：

$targetDiv.find("font").each(function ()
{
   if (this.firstChild.nodeType === 3)
   {
       this.firstChild.data = "";
   }
}); 

但是很难删除“一个”部分。

$targetDiv[0].firstChild
<div>

$targetDiv[0].firstChild.data
undefined

$targetDiv[0].firstChild.innerText
undefined

$targetDiv[0].firstChild.innerHTML
"one<font face="Impact" size="4">www</font>"

$targetDiv[0].firstChild.innerText
undefined

$targetDiv[0].firstChild.textContent
"onewww"

Answer 1

尚不清楚它位于什么上下文中，或者$targetDiv是什么，但是根据得到的结果，我们可以假定您使用的是Firefox，并且$targetDiv是第一个div，并且应该可以使用

$($targetDiv.find("div").get(0).firstChild).remove();

小提琴

Answer 2

您可以使用本机.removeChild方法删除第一个文本节点：

var div=targetDiv[0].firstChild;
div.removeChild(div.firstChild);

从要删除的节点的父级调用此方法，并接收要删除的节点作为其参数。

---

现代浏览.remove()您可以简单地在节点本身上调用.remove() 。

target[0].firstChild.firstChild.remove();

---

您的.each()循环已关闭。 在那种特殊情况下，由于one文本节点是文本节点中唯一的兄弟节点，因此您将迭代目标下的子节点，因为只有一个。

$targetDiv.children("div").each(function ()
{
   if (this.firstChild.nodeType === 3)
   {
       this.firstChild.data = "";
   }
});

尽管在这种情况下，直接针对它而不是针对循环更有意义。

Answer 3

尝试，

$($targetDiv.children('div').contents()[0]).remove();

DEMO