javascript - 使用 puppeteer 单击可见元素

标签 javascript selenium puppeteer

我正在尝试单击页面中的许多元素,但前提是它们可见。这很容易使用 selenium(使用 is_displayed ),但我似乎无法在 puppeteer 中找到方法。
我试图使用类似的东西

try {
    await page
      .waitForSelector(id, visible=true, timeout=0)
      .then(() => {
        element.click()
      });
...

但是,如果它是一个简单的元素,例如:
<a class="cookie-close" href="#">
OK
</a>

我似乎也看不到使用 element.click 的方法。 puppeteer 戏中的方法。

最佳答案

简答

const element = await page.waitForSelector('a.cookie-close', { visible: true });
await element.click();

这使用 page.waitForSelector 使用选择器a.cookie-close 选择可见元素的函数.查询选择器后,代码使用 elementHandle.click 点击它。

解释

只有函数 page.waitForSelector page.waitForXPath 有一个内置选项,用于检查元素是否不仅存在而且可见。使用时, puppeteer 师will check如果样式属性visibility不是 hidden如果元素有 visible bounding box .

确保元素不为空

即使元素可见,它也可能是空的(例如 <span></span> )。如果您还希望元素不为空,则可以改用以下查询:

const element = await page.waitForSelector('SELECTOR:not(:empty)', { visible: true });

这将另外使用伪选择器 :empty :not 确保元素包含子节点或文本。如果您想查询元素内的特定文本,您可能需要查看 this answer .

关于javascript - 使用 puppeteer 单击可见元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47014724/

相关文章:

python - Selenium webdriver 错误 - 过时的元素引用

google-chrome - 定义 Chrome DevTools 窗口的默认宽度

javascript - 如何使用 Angularjs 和 Javascript 获取客户端 IP 地址以及语言和国家/地区

javascript - 在 highcharts 标签中添加图像

php - 如何获取PHP脚本以在li元素中制作javascript

python - Python Selenium数组

javascript - 如何压缩用webrtc拍摄的视频,然后再将其发送到服务器?

java - 如何使用 Selenium WebDriver 处理 'Log in with Google' 弹出窗口

javascript - 如何使用 puppeteer 在 <div> 列表中抓取

javascript - puppeteer 师选择链接