Javascript JQuery:contains（）无法获取子节点中的第一个文本节点

我有一个要解析的HTML结构：

<div id="body">

<div id="hello">
This is some text. 
And i want to append it in red.
<div id="welcome">
hey what about ?
</div>
</div>
</div>

这是一些文本。
我想把它加上红色。
嘿，怎么了？

这是我的js：

var x = $('#body:contains("This is")').text();

$('#body').append('<div style="color:red;">'+x+ '</div>')

var x=$（'#body:contains（“This is”））.text（）；
$（'#body'）。附加（''+x+''）

我想推断第一个文本节点，而不是第二个，所以结果应该是红色的文本，上面写着“这是一些文本”。 我想把它加上红色，这是一些文字。 我想把它加上红色。嘿，那怎么办？”

我必须只使用一个选择器来实现这一点，而不需要额外的函数和方法

这是一把活小提琴：

我还尝试了：

$（'hello*：not（div）'）。text（）但它不起作用……：/

谁能帮帮我吗

感谢因为
text（）
将获取元素中的所有文本，而不管是否有子元素。您可以执行以下操作：

 $('#body >:contains("This is")').each(function(){
    var txt = $(this).clone().children().remove().end().text();
    $('#body').append('<div style="color:red;">'+txt+ '</div>');     
 });

$（'#body>：包含（“这是”））。每个（函数（）{
var txt=$（this.clone（）.children（）.remove（）.end（）.text（）；
$（'#body'）。追加（''+txt+''）；
});

这假设您要搜索的文本总是直接位于
#body
的子对象中，而不是任何子对象中

由于
text（）
将获取元素中的所有文本，而不管是否有子元素，因此您可以执行以下操作：

 $('#body >:contains("This is")').each(function(){
    var txt = $(this).clone().children().remove().end().text();
    $('#body').append('<div style="color:red;">'+txt+ '</div>');     
 });

$（'#body>：包含（“这是”））。每个（函数（）{
var txt=$（this.clone（）.children（）.remove（）.end（）.text（）；
$（'#body'）。追加（''+txt+''）；
});

这假设您要搜索的文本总是直接位于
#body
的子对象中，而不是任何子对象中

#body:contains（“This is”）
仅查找id为body且内部文本包含“This is”的元素。您希望子元素包含“This is”

因此，您应该使用：
#body>div:contains（“这是”）
或
#body>*：contains（“这是”）
。现在，您可以使用第一个元素的
childNodes[0]
，与
childNodes[0]
相比，该元素包含文本节点来选择所需的文本


var x=$（'#body>div:contains（“This is”））[0].childNodes[0].wholeText；
$（'#body'）。附加（''+x+''）

这是一些文本。
我想把它加上红色。
嘿，怎么了？
#body:contains（“This is”）

仅查找id为body且内部文本包含“This is”的元素。您希望子元素包含“This is”

因此，您应该使用：

#body>div:contains（“这是”）

或

#body>*：contains（“这是”）

。现在，您可以使用第一个元素的

childNodes[0]

，与

childNodes[0]

相比，该元素包含文本节点来选择所需的文本

var x=$（'#body>div:contains（“This is”））[0].childNodes[0].wholeText；
$（'#body'）。附加（''+x+''）

这是一些文本。
我想把它加上红色。
嘿，怎么了？

您不能仅使用一个选择器而不使用其他选择器methods@charlietfl#hello:not（div）应该选择第一个文本，而不是第二个文本，但我真的不明白为什么不起作用..因为没有文本节点的选择器。您可以克隆元素，删除子元素并获得结果文本what i mean@charlietfl排除子元素这将选择什么？在父项中使用：not（）排除子项不应选择它的唯一文本！？！？！不幸的是，没有

text（）

获取元素中的所有文本，包括子元素中的文本您不能仅使用一个选择器而不使用其他选择器methods@charlietfl#hello:not（div）应该选择第一个文本，而不是第二个文本，但我真的不明白为什么不起作用..因为没有文本节点的选择器。您可以克隆元素，删除子元素并获得结果文本what i mean@charlietfl排除子元素这将选择什么？在父项中使用：not（）排除子项不应选择它的唯一文本！？！？！不幸的是，没有

text（）

获取元素中的所有文本，包括children中的文本仍然包括元素中不需要的文本grandchild@charlietfl很抱歉，我已经更新了我的答案。只能使用text（）我正在寻找一个解决方案来直接选择它。为什么？这真的毫无意义。这个问题的答案有一个jquery方法，但它基本上做了相同的事情：仍然在grandchild@charlietfl很抱歉，我已经更新了我的答案。只能使用text（）我正在寻找一个解决方案来直接选择它。为什么？这真的毫无意义。这个问题的答案有一个jquery方法，但它基本上做了相同的事情：不能只使用每个选择器：/只能在查找多个匹配项时使用选择器。没有任何方法排除选择器中的所有child元素吗d不能仅使用每个选择器：/n只有在查找多个匹配项时才能使用选择器。是否有任何方法可以排除选择器中的所有child元素？：D