不灭的焱

我知道我可以使用

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');