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>

我似乎也看不到使用 puppeteer 中的 element.click 方法来完成此操作的方法。

最佳答案

简答

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/

相关文章:

javascript - 父子div的位置都是: absolute. 如何让子div占据页面100%的宽度和高度?

javascript - Angularjs 错误 : [$injector:modulerr] http://errors. angularjs.org/1.4.7/$injector/modulerr?p0

ruby - 使用 Ruby : select an option from drop-down list 进行自动化测试

java - Selenium 代码查找段落中的字数

java - 如何使用带有 Java 的 Selenium WebDriver 向下滚动

javascript - 如何在 Puppeteer 中单击带有文本的元素?

javascript - 如何在 React.js 中将事件函数分配给 DOM 列表

javascript - 如何格式化 casper.log 输出?

node.js - 使用 Node.js 中的 async/await 函数限制从 CSV 文件读取的行数

node.js - Puppeteer 不会返回来自特定网站的所有请求