javascript - elementHandle.$x(expression) 似乎没有相对于给定的 elementHandle 运行

Question

我有以下代码获取“总线”层的元素句柄(在 32 个不同层的列表中)

const [layerFound] = await page.$x("//div[@class='layer']/label[.='Buses']/..");

然后我需要对该“层”对象中的其他元素执行一些激活/验证。但是下一行并没有从 Buses 层中获取“visible-toggle”对象，而是从 32 列表的第一层中获取对象。

const [layerVis] = await layerFound.$x("//div[contains(@class, 'layer-option visible-toggle')]");

我的理解是 elementHandle.$x(expression) 计算相对于 elementHandle 的 XPath 表达式。但它是相对于页面对象进行的。

其中有很多。第一个是“桥梁”。哪个是被发现/使用的。

<div class="layer">
  <label class="layer-label"><div>Buses</div></label>
  <div class="layer-option entity-count"><div>(629)</div></div>
  <div class="layer-option visible-toggle ">...</div>
  <div class="layer-option layer-preferences-toggle">...</div>
</div>

Answer 1

您需要使用相对的 XPath:

const [layerVis] = await layerFound.$x(".//div[contains(@class, 'layer-option visible-toggle')]");

(XPath 表达式前的点)

否则您的 XPath 将再次从文档根目录搜索。