木偶:要按顺序操纵页面的DIV / html元素?

时间:2019-02-22 11:34:34

标签: javascript html jquery-selectors puppeteer

作为JavaScript新手,我了解到如何使用Puppeteer抓取网站,与某些动态生成的网站一起使用的最简单方法是创建一个循环,以循环浏览某些Div ,然后根据其特定属性触发操作(例如,使用`class = Clickable单击所有Div循环)

在线上的大多数Puppeteer示例都是如何通过某些名称/类来选择页面元素的,例如在here中,而不是如何创建经过{{ 1}},然后根据它们执行操作。

由于我是Java语言的新手,所以如果有人可以给我一些建议或指示,我将非常感激。

示例:我想从某些Div的最底层抓取数据,在这种情况下,这些数据中的Div是字母C的某些变体,因此我打开以下{ {1}}采用以下方式,并计划在最后提取一些数据,

section=

我希望我的用例现在更清楚。

1 个答案:

答案 0 :(得分:2)

我理解正确吗?您有一些隐藏的div嵌套层;要显示下一层,您需要单击一些可见元素;那么隐藏的元素就变得可见了,您还需要单击它以进行下去吗?

如果是这样,可能有两种情况。

  1. 如果扩展始终是同步的。然后可以在浏览器上下文中完成所有遍历:
await page.evaluate(() => {
  const sections = ['C', 'c', 'i'];

  for (let section of sections) {
    const element = document.querySelector(`[section=${section}]`);
    element.click();
  }
});
  1. 如果扩展可能是异步的(例如,发生在XHR / fetch调用上)。然后我们需要在Node.js上下文中进行异步检查:
const sections = ['C', 'c', 'i'];
for (let section of sections) {
  const element = await page.waitForSelector(`[section=${section}]`, { visible: true });
  await element.click();
}