Question

我正在尝试使用puppeteer来输入输入字段，但出现以下错误。

Error: failed to find element matching selector "#cardCvc-input"

我的代码是：

await page.$eval('#cardCvc-input', e => e.value = "000")

DOM中的节点如下：

<input _ngcontent-ng-cli-universal-c1="" autocomplete="off" cccvc="" class="form-control ng-pristine ng-
invalid ng-touched" id="cardCvc-input" maxlength="4" minlength="3" name="cardCvc" pattern="[0-9]{4}|[0-
9]{3}" required="" type="tel">

希望有人可以告诉我我做错了什么。请注意，当我检查页面源代码时，实际上看不到DOM。这是一堆JavaScript代码。这和它有什么关系吗？

还注意到存在iframe父节点。

Answer 1

由于元素位于iframe中，因此您需要先选择iframe，然后再选择元素：

await page.waitForSelector('iframe'); //make sure you use the correct selector for the iframe
const iframeElement = await page.$('iframe'); //make sure you use the correct selector for the iframe
const frame = await iframeElement.contentFrame();
await frame.waitForSelector('#cardCvc-input');
await frame.$eval('#cardCvc-input', e => e.value = "000");

Answer 2

您可以在呼叫waitForSelector之前添加evaluate。因此，您将等待javascript代码创建该DOM元素。

await page.waitForSelector('#cardCvc-input');
await page.$eval('#cardCvc-input', e => e.value = "000")

找不到元素匹配选择器

2 个答案: