javascript - 如何使用xpath从用 Angular 编写的网页中提取文本？

Question

以前，谷歌语音允许您使用“div”提取短信代码。最近，他们切换到使用 AngularJS 的基于 ARIA 的框架。如何从网页中提取包含所有短信代码的字符串？

这是我与目标 xpath 一起使用的命令:

var search2 = document.evaluate('//*[@id="messaging-view"]/div/md-content/div/gv-conversation-list/md-virtual-repeat-container/div/div[2]/div[1]/div/gv-text-conversation-item/gv-conversation-item/div/div[2]/ng-transclude/gv-conversation-item-detail/gv-annotation/text()',
  document, null, XPathResult.ANY_TYPE, null);

Here is the result I see on my Chrome Developer console

Answer 1

看看Mozilla documentation on XPath in javascript 。您返回的称为节点迭代器。如果您像以前那样指定 ANY_TYPE，这可能是 XPath 查询最常见的返回类型。要使您的代码按原样工作，您可以执行以下操作:

// im putting your query in a variable for readability
var query = '//*[@id="messaging-view"]/div/md-content/div/gv-conversation-list/md-virtual-repeat-container/div/div[2]/div[1]/div/gv-text-conversation-item/gv-conversation-item/div/div[2]/ng-transclude/gv-conversation-item-detail/gv-annotation/text()';
var search2 = document.evaluate(query, document, null, XPathResult.ANY_TYPE, null);

var thisNode = iterator.iterateNext();

while (thisNode) {
    console.log(thisNode.textContent); // probably will be a text node
    thisNode = iterator.iterateNext();
}   

或者，您可以将结果类型指定为 STRING_TYPE 来简化它。

// im putting your query in a variable for readability
var query = '//*[@id="messaging-view"]/div/md-content/div/gv-conversation-list/md-virtual-repeat-container/div/div[2]/div[1]/div/gv-text-conversation-item/gv-conversation-item/div/div[2]/ng-transclude/gv-conversation-item-detail/gv-annotation/text()';
var search2 = document.evaluate(query, document, null, XPathResult.STRING_TYPE, null);

console.log(search2.stringValue);