JavaScript在元素中计算XPATH？_Javascript_Html_Dom_Xpath

JavaScript在元素中计算XPATH？

javascript html dom xpath

JavaScript在元素中计算XPATH？,javascript,html,dom,xpath,Javascript,Html,Dom,Xpath,我正在尝试使用document.evaluate（）获取元素，但也希望只在特定元素中搜索。例如： const element = document.evaluate('.//p', ...); //I want this to return the Hello, World p element 你好，世界是否有任何方法可以将id为someId的div传递到evaluate中，以便仅在该范围内进行搜索我知道我可以像//div[@id=“someId”]/p那样编写整个XPATH（在我的情

我正在尝试使用document.evaluate（）获取元素，但也希望只在特定元素中搜索。例如：

const element = document.evaluate('.//p', ...); //I want this to return the Hello, World p element


你好，世界

是否有任何方法可以将id为someId的div传递到evaluate中，以便仅在该范围内进行搜索

我知道我可以像//div[@id=“someId”]/p那样编写整个XPATH（在我的情况下不起作用）或进行字符串连接，但我想找到一种更干净的方法来完成它，比如将DOM元素（或它包含的某个对象）传递到某个地方。

这正是以下第二个参数的目的：

contextNode

指定查询的上下文节点（请参阅）。通常将文档作为上下文节点传递

const someId=document.getElementById（'someId'）；
const result=document.evaluate（'.//p'，someId，null，XPathResult.ORDERED\u NODE\u SNAPSHOT\u TYPE，null）
console.log（result.snapshotItem（0））；//你好，世界！
console.log（result.snapshotItem（1））；//空


你好，世界
再见，世界

这正是第二个参数的目的：

contextNode

指定查询的上下文节点（请参阅）。通常将文档作为上下文节点传递

const someId=document.getElementById（'someId'）；
const result=document.evaluate（'.//p'，someId，null，XPathResult.ORDERED\u NODE\u SNAPSHOT\u TYPE，null）
console.log（result.snapshotItem（0））；//你好，世界！
console.log（result.snapshotItem（1））；//空


你好，世界
再见，世界

您还可以使用查询中的父id（如您所问）为

上下文节点使用文档
。像这样：

const snapshotType=XPathResult.ORDERED\u NODE\u SNAPSHOT\u TYPE；
const result1=document.evaluate（'.//div[@id=“someId”]//p'，document，null，快照类型）；
log（`result1包含${result1.snapshotLength}元素，即`，result1.snapshotItem（0））
//或者搜索实际文本
const result2=document.evaluate（'.//p[contains（text（），“Hello”）]'，document，null，快照类型）；
log（`result2包含${result2.snapshotLength}元素，即`result2.snapshotItem（0））；
//最后，如果元素顺序是固定的，则可以使用第一个
const result3=document.evaluate（“（../p）[1]”，document，null，snapshotType）；
log（`result3包含${result3.snapshotLength}元素，即`result3.snapshotItem（0））

你好，世界
再见，世界
我就走了
您还可以使用查询中的父id（如您所问）为上下文节点使用文档
。像这样：

const snapshotType=XPathResult.ORDERED\u NODE\u SNAPSHOT\u TYPE；
const result1=document.evaluate（'.//div[@id=“someId”]//p'，document，null，快照类型）；
log（`result1包含${result1.snapshotLength}元素，即`，result1.snapshotItem（0））
//或者搜索实际文本
const result2=document.evaluate（'.//p[contains（text（），“Hello”）]'，document，null，快照类型）；
log（`result2包含${result2.snapshotLength}元素，即`result2.snapshotItem（0））；
//最后，如果元素顺序是固定的，则可以使用第一个
const result3=document.evaluate（“（../p）[1]”，document，null，snapshotType）；
log（`result3包含${result3.snapshotLength}元素，即`result3.snapshotItem（0））

你好，世界
再见，世界
我就走了

<html>
  <body>
    <div id="someId">
      <p>Hello, World!<p>
    </div>
  </body>
</html>