获取元素的内容而不显示其子元素

Question

我有一个温和的偏好,在纯JS中解决这个问题,但如果jQuery版本更简单,那么jQuery也很好.有效的情况是这样的

<span id="thisone">
 The info I want
 <span id="notthisone">
  I don't want any of this nonsense
 </span>
</span>

我实际上想要得到
The info I want
但不是
The info I want I don't want any of this nonsense
,我特别不想要
The info I want <span id="notthisone"> I don't want any of this nonsense </span>
哪个是我现在得到的...

我该怎么做？

Answer 1

仅限js:

尝试一下: http ://jsfiddle.net/g4tRn/

var result = document.getElementById('thisone').firstChild.nodeValue;    

?alert(result);?

使用jQuery:

试一试: http ://jsfiddle.net/g4tRn/1

var result = $('#thisone').contents().first().text();  

alert(result);?

奖金:

如果<span>您想要获得外部的其他文本节点,您可以执行以下操作:

试一试: http ://jsfiddle.net/g4tRn/4

var nodes = document.getElementById('thisone').childNodes;
var result = '';

for(var i = 0; i < nodes.length; i++) {
    if(nodes[i].nodeType == 3) {       // If it is a text node,
        result += nodes[i].nodeValue;  //    add its text to the result
    }
}

alert(result);
?