Question

我有一个我正在抓取的网页，我正在寻找的文字位于span内，其中包含另一个span

<div class="someParentDiv">
  <span>this is the text I want   
    <span class="childSpanClass">I don't want this text</span>
  </span>
</div>

我正在尝试使用jQuery选择获取我想要的文本，但是当我使用text()获取elemnt的文本时，我也会得到子span的文本，这是我不想要的。

我设法只获得了我想要的文字

$('div.someParentDiv span').remove('.childSpanClass')

但对我来说似乎有点倒退（see example），我想知道是否有更好，更好的方法来做到这一点。有什么想法吗？

Answer 1

您可以通过循环所有contents过滤掉不纯文本的所有内容：

var node = $('.someParentDiv > span').contents().filter(function() {
    return this.nodeType == 3; // text node
});

alert(node.text());

Answer 2

没有JQuery：选择textContent中span元素的第一个孩子的div.someParentDiv。第一个子节点是该范围的TEXT_NODE（请参阅MDN），它是一个（不可见）单独节点。使用JQuery使用$('.someParentDiv span').contents().first('[nodeType=3]').text();

＆＃13;

var res = document.querySelector('#result');

// no jquery
res.innerHTML = 'DOM: ' + 
                 document.querySelector('.someParentDiv span').firstChild.textContent;

// jquery

res.innerHTML += '<br>JQuery: ' +  
                 $('.someParentDiv span').contents().first('[nodeType=3]').text();

＆＃13;

#result {
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="someParentDiv">
  <span>this is the text I want   
    <span class="childSpanClass">I don't want this text</span>
  </span>
</div>

<div id="result"></div>

＆＃13;

Answer 3

类似的问题：

jQuery get .text() but not the text in span

NodeType解释

http://code.stephenmorley.org/javascript/dom-nodetype-constants/

jQuery - 只获取没有子元素的父元素文本

3 个答案: