Javascript 单击按钮（如果有），否则单击“木偶演员”中的其他按钮

我试图在Puppeter中设置一个

if/else

语句，如果某个按钮存在，则单击该按钮，否则单击另一个按钮。我正在做这样的事情：

if (document.querySelector('#buttonToClick') !== null) {
    await page.waitForSelector('#buttonToClick');
    await page.click('#buttonToClick');
  } 

else { 
// first click #otherButton and then click #buttonToClick
    await page.waitForSelector('#otherButton');
    await page.click('#otherButton');

    await page.waitForSelector('#buttonToClick');
    await page.click('#buttonToClick');
  }

出于某种原因，我一直陷入

else

块，即使我在Chrome控制台上执行

document.querySelector（“#按钮点击”）==在所需页面上为空

，显示为

true

更新：以下代码似乎适合我，但我不确定原因

await page.waitFor(3000);

  if ((await page.$('#buttonToClick')) !== null) {
    await page.click('#buttonToClick');
  } else {
    await page.waitForSelector('#otherButton');
    await page.click('#otherButton');

    await page.waitForSelector('#buttonToClick');
    await page.click('#buttonToClick');
  }`

我想这可能与DOM的加载方式有关，所以我尝试：

await page.waitForNavigation({waitUntil: 'domcontentloaded'})
// await page.waitFor(3000)

  if ((await page.$('#buttonToClick')) !== null) {
    await page.click('#buttonToClick');
  } else {
    await page.waitForSelector('#otherButton');
    await page.click('#otherButton');

    await page.waitForSelector('#buttonToClick');
    await page.click('#buttonToClick');
  }

---

但这不起作用…它只适用于

wait page.waitFor（30000）

在

if

语句之前…知道为什么吗？

我认为

document.querySelector

通常不存在于node.js程序中。木偶演员确实提供，这是一个密切的模拟。它回报了一个承诺

更新：根据问题中的新信息，似乎DOM树中包含

#按钮单击

的部分是在DOMContentLoaded事件之后构建的。我使用

page.waitForNavigation（{waitUntil:'networkidle0'}）

获得了很好的效果，不过如果网络连接延迟，使用“networkidle2”或其他选项可能会更好。请参见此处的各种选项：

我认为这应该行得通：

await page.waitForNavigation({ waitUntil: 'networkidle0' });
if (await page.$('#buttonToClick') !== null) {
    await page.click('#buttonToClick');
  } else {
    await page.waitForSelector('#otherButton');
    await page.click('#otherButton');
  }

---

听起来你真正想要的是

const btn = await Promise.race([
      page.waitForSelector('#buttonToClick'),
      page.waitForSelector('#otherButton')
]);

await btn.click()

---

i、 e.等待一个或另一个按钮。先找到哪个，单击那个。这甚至适用于SPA或基于ajax的页面，在加载时按钮不会立即出现。

可能结果是“未定义”，因此！==null将始终为真。在不使用的情况下尝试。。你能记录document.querySelector（“#buttonToClick”）并在这里传递结果吗？你能发布更多你的

node.js

程序吗？我的印象是

文档。querySelector

将是您网页的一部分，而不是傀儡程序的一部分。这是运行文档的结果。Chrome控制台中的querySelector（#选择文件按钮）（我要单击的按钮）：

上载新文件

等待页面。$从不为我返回null！我正在尝试检查页面上是否有元素，但似乎不可能。您粘贴的此代码使我走上了正确的轨道，但直到我添加：

wait page.waitFor（3000）；如果（（wait page.$（“#buttonToClick”）！==null）{wait page.click（“#buttonToClick”）}或者{wait page.waitForSelector（“#otherButton”）；wait page.click（“#otherButton”）；}

然后它就工作了……不过我不喜欢等待固定秒数的想法，感觉我已经更新了我的答案--听起来你的页面好像是在启动

DOMContentLoaded

后添加了按钮。非常感谢你的帮助。我尝试添加

wait page.waitForNavigation（{waitUntil:'networkidle0'}）wait page.waitForNavigation（{waitUntil:'networkidle2'}）等待页面。waitFor（3000）

出于某种奇怪的原因…偶数

等待页面。waitFor（1000）

似乎也能正常工作……我想我不得不接受这个LOL。你可能有幸在

页面中设置
waitUntil
。goto

调用，例如

page.goto（url，{waitUntil:'networkidle0'}）

。这听起来可能不起作用。仅供参考：谢谢，有没有办法知道哪个btn被点击了？下面是我测试的网站上发生的事情：按钮点击可用吗？如果可以，点击它然后继续。否则，点击#其他按钮，然后点击#按钮点击。我认为你的上述场景是io将适用于我的“If”情况，但在“Else”情况下，我需要首先单击#other按钮，然后单击#buttonoclick，在这种情况下，我将知道在等待btn后实际单击了哪个按钮。单击（）如果这有意义的话？我已经用了10分钟的木偶演员了，所以我不知道，但我确信

btn

对象中有很多有趣的细节，可以告诉你它找到了哪一个。一旦你知道它是什么，你可以点击或不点击，或者做任何你需要做的事情。