用jq获取元素内文本，但不包括其子元素内的文本值的方法

2022-10-30 19:56:26

<li id="listItem">

    This is some text

    <span id="firstSpan">First span text</span>

    <span id="secondSpan">Second span text</span>

</li>

假设上面一段代码，我们想获取 'This is some text' 这段文本值，

jq提供的方法是 text()，但结果打印的是 ‘This is some textFirst span textSecond span text’,

可见text()方法返回的值是元素内所有子元素内的文本值，那么如果只想获取 'This is some text' 怎么办呢？

有下面几种方法：

1、jq方法

$("#listitem")

    .clone()    //复制元素

    .children() //获取所有子元素

    .remove()   //删除所有子元素

    .end()  //回到选择的元素

    .text();//获取文本值

2、jq方法

$("#listItem").contents().filter(function(){

  return this.nodeType == 3;

})[0].nodeValue = "The text you want to replace with"

3、js方法

document.getElementById("listItem").childNodes[0].nodeValue;

码农公寓