Question

我想获取具有特定id的特定元素的属性值。举例来说，我想获得href标记的a id 下一个：

<a href="?page=3" id="next">Next</a>

我知道我可以这样做：

console.log(document.evaluate('//a[@id="next"]', document, null, XPathResult.ANY_TYPE, null).iterateNext().href);

但问题是，在我的情况下，属性的名称可能不同，我需要一种方法通过xpath查询指定它。像这样：

'//a[@id="next"]/@href'

Answer 1

试试这样的事情：

document.evaluate('//a[@id="next"]/@href', document, null, XPathResult.ANY_TYPE, null).iterateNext().value;

根据您在xpath中指定的元素类型（元素节点，文本节点，属性），iterateNext()将返回不同类型的对象。在这种情况下，指定@href属性，它返回一个javascript Attr对象，其属性value包含属性的值。继续你的例子：

<a href="?page=3" id="next">Next</a>

您可以尝试下一个示例：

＆＃13;

//Returns true
console.log(document.evaluate('//a[@id="next"]/@href', document, 
  null, XPathResult.ANY_TYPE, null).iterateNext() instanceof Attr);

//Returns "?page=3"
console.log(document.evaluate('//a[@id="next"]/@href', document, 
  null, XPathResult.ANY_TYPE, null).iterateNext().value);

//Returns true
console.log(document.evaluate('//a[@id="next"]', document,
  null, XPathResult.ANY_TYPE, null).iterateNext() instanceof Node);

//Returns false
console.log(document.evaluate('//a[@id="next"]', document,
  null, XPathResult.ANY_TYPE, null).iterateNext() instanceof Attr);

//Returns true
console.log(document.evaluate('//a[@id="next"]', document,
  null, XPathResult.ANY_TYPE, null).iterateNext().nodeType === Node.ELEMENT_NODE);

//Returns "Next"
console.log(document.evaluate('//a[@id="next"]', document,
  null, XPathResult.ANY_TYPE, null).iterateNext().textContent);

//Returns true
console.log(document.evaluate('//a[@id="next"]/text()', document,
  null, XPathResult.ANY_TYPE, null).iterateNext() instanceof Node);

//Returns true
console.log(document.evaluate('//a[@id="next"]/text()', 
  document, null, XPathResult.ANY_TYPE, null).iterateNext().nodeType === Node.TEXT_NODE);

//Returns "Next"
console.log(document.evaluate('//a[@id="next"]/text()', document, 
  null, XPathResult.ANY_TYPE, null).iterateNext().nodeValue);

＆＃13;

<!DOCTYPE html>
<html>
<body>
<a href="?page=3" id="next">Next</a>
</body>
</html>

＆＃13;

一些可以帮助您的链接：

Answer 2

您可以使用Element.attributes property

document.evaluate('//a[@id="next"]', document, null, XPathResult.ANY_TYPE, null).iterateNext().attributes['href'].value

或getAttribute() method

document.evaluate('//a[@id="next"]', document, null, XPathResult.ANY_TYPE, null).iterateNext().getAttribute('href')

JavaScript XPath：如何获取元素的属性值？

2 个答案: