我怎样才能用 puppeteer 点击 display:none 元素？

Question

我想单击 display 属性 是 none 的元素。 我怎样才能做到这一点？

代码：

page.click(".foo");

Answer 1

您可以使用JavaScriptclick函数。该函数会触发元素的点击事件，不关心元素是否可见

需要在页面内使用page.evaluate执行

示例：

await page.evaluate(() => {
  document.querySelector('.foo').click();
});

Answer 2

问题仍然存在，对我来说没有用：await page.evaluate(() => { document.querySelector('.foo').click(); });

花了至少半天后，我做了一个小技巧，将 CSS 'display' 属性 更改为 'inherit'，单击（）一个元素，然后还原 CSS 'display' 回到原来的状态。

  let inputCheckBox = await document.querySelector("input[type='checkbox']");

  const cssDisplay = inputCheckBox.style.display;
  if (!cssDisplay || 'none' === cssDisplay) {
     inputCheckBox.style.display = 'inherit';
  }

  await inputCheckBox.click();

  if (cssDisplay !== inputCheckBox.style.display) {
     inputCheckBox.style.display = cssDisplay;
  }