PHP笔记网

革命尚未成功,同志仍须努力下载JDK17

作者:Albert.Wen  添加时间:2023-07-22 11:10:29  修改时间:2024-12-25 05:25:28  分类:03.数据采集/爬虫  编辑

我知道我可以使用

await page.type('#inputID', 'blah');

在文本框中插入“blah”(在我的情况下,该文本具有现有文本,仅附加“blah”),但是,我找不到任何允许删除或替换现有文本的页面方法。

最佳答案

您可以使用page.evaluate来按需操作DOM:

await page.evaluate( () => document.getElementById("inputID").value = ""; )

但是有时仅操作给定的字段可能还不够(目标页面可以是带有事件侦听器的SPA),因此最好模拟真实的按键。

在这里,我们按Backspace的次数与该字段中存在字符的次数相同:

const inputValue = await page.$eval('#inputID', el => el.value);
for (let i = 0; i < inputValue.length; i++) {
  	await page.keyboard.press('Backspace');
}

另一个有趣的解决方案是单击目标字段3次,以便浏览器将选择其中的所有文本,然后您可以键入所需的内容:

const input = await page.$('#inputID');
await input.click({ clickCount: 3 })   // 【推荐】这种方法
await input.type("Blah");

或按住快捷键:Ctrl+A  —— 注:这种方式在Mac下存在兼容性问题,即不起作用

// (1) 获取焦点
await page.focus(selector);
// (2) 按住Ctrl键
await page.keyboard.down('Control');
// (3) 按下A键
await page.keyboard.press('KeyA');
// (4) 松开Ctrl键
await page.keyboard.up('Control');