为什么Puppeteer的$(<selector>)选择元素后调用click方法报错？

问题原因 #

page.$() 是异步方法，必须添加 await 关键字等待执行完成后，才能拿到对应的DOM元素句柄（ElementHandle实例）。你当前的代码没有加 await，website_input 实际是一个 Promise 实例，本身不存在 click 方法，因此抛出了「website_input.click is not a function」的报错。

你用到的 page.type 可以正常执行，是因为该方法是 Puppeteer 封装的快捷操作方法，第一个参数直接接收选择器字符串，方法内部已经自动完成了查找元素、执行输入的全流程，不需要你手动获取元素句柄，因此不会触发异步等待相关的问题。

修复方案 #

方案1：给元素查询逻辑添加await #

// 可选：提前等待元素渲染可见，避免元素未加载完成导致查询返回空
await page.waitForSelector("input[name='website']", { visible: true });
// 加await等待元素查询完成，拿到ElementHandle实例
const website_input = await page.$("input[name='website']");
await website_input.click({clickCount: 3});
await website_input.press('Backspace'); 

方案2：直接使用Puppeteer快捷操作方法 #

和 page.type 逻辑一致，直接调用 page.click 传入选择器即可，不需要手动获取元素句柄：

await page.click("input[name='website']", {clickCount: 3});
await page.keyboard.press('Backspace');

内容的提问来源于stack exchange，提问作者Eldan Shkolnikov