如何查找选定元素或 ElementHandle 的后代元素？

Question

在其他浏览器自动化框架中，往往有一个 "find" 方法允许用户找到与选择器匹配的给定元素的所有后代，例如：

https://www.w3schools.com/jquery/jquery_traversing_descendants.asp

$(document).ready(function(){
   $("div").find("span");
});

上述方法 returns 从给定 div.

降序匹配 span 的所有元素

如果我有一个 ElementHandle，有没有办法使用 puppeteer 找到与给定选择器匹配的所有依赖项？

Answer 1

是的，您可以使用 elementHandle.$ 功能。引自文档：

The method runs element.querySelector within the page. If no element matches the selector, the return value resolves to null.

代码示例：

const elementHandle = await page.$('div');
const elementInsideHandle = await elementHandle.$('span');

如果要查询多个元素，页面里面还有$$函数到运行element.querySelectorAll