Question

如果使用jQuery在带有文本的子元素时从父DIV获取文本？

<div id='div_1'>
  I am a DIV
  <span>
    I am a SPAN
  </span> 
</div>

如果我要使用$（'＃div_1'）。text（），它会给我'我是DIV我是SPAN'。如何从'div_1获取'我是DIV'的文字？非常感谢任何帮助，谢谢。

Answer 1

尝试：

$('#div_1').clone().children().remove().end().text();

Answer 2

<div id='div_1'> 
  I am a DIV 
  <span> 
    I am a SPAN 
  </span>  
</div> 
<script> 
$(function(){ 
    $("#div_1").contents().filter('*').remove(); 
}); 
</script>

http://sandbox.phpcode.eu/g/c4fb9.php

Answer 3

您可以直接访问要查找的文本节点。在您的情况下，请使用以下内容：

 $('#div_1')[0].childNodes[0].nodeValue

每个节点都有一个子节点列表，可以是其他HTML元素或文本节点。因此，我们得到第一个孩子（在你的情况下是一个文本节点）并返回nodeValue这将是文本本身。这是一个example。

Answer 4

您可以使用.remove()删除div中的HTML元素。 Here's a JSFiddle

和它一起使用的代码：

HTML

<div id='div_1'>
  I am a DIV
  <span>
    I am a SPAN
  </span> 
</div>

<div id="output"></div>

的JavaScript

$(document).ready(function() {
    var div = $("div#div_1").clone();

    div.find("*").remove();

    $("div#output").text(div.text());
});

我使它变得比它需要的更复杂（使用.clone()），因此保留了div的原始内容。如果您只想获取文字并且不关心原始内容，可以将.clone()退出。

如何使用jQuery获取带有文本的子元素时，只能从DIV获取文本？

4 个答案:

HTML

的JavaScript