使用Node Playwright为HTML元素添加onclick点击事件的方法

你已经用到的elementHandle.evaluate()就是实现该需求的核心方法，仅需修改方法内的节点操作逻辑即可完成onclick事件注入：

const elementHandle = await page.$('#ctl00_ContentPlaceHolder1_lbl_Val_Tomador');
await elementHandle.evaluate(node => {
  // 直接为元素绑定onclick事件
  node.onclick = function() {
    // 此处写入点击事件触发后要执行的自定义逻辑
    console.log('点击事件触发');
  };
});

补充场景处理 #

• 如需保留元素原有onclick逻辑，仅追加新的点击事件，可使用addEventListener实现：

await elementHandle.evaluate(node => {
  node.addEventListener('click', function(e) {
    // 自定义点击逻辑
    console.log('追加点击事件触发', e);
  });
});

• 若事件逻辑需要用到Node.js上下文的变量，可通过evaluate的第二个参数传递到浏览器执行环境：

// Node.js 上下文定义的变量
const customText = '自定义提示内容';
await elementHandle.evaluate((node, text) => {
  node.onclick = () => alert(text);
}, customText); // 外部变量在此处传入

内容的提问来源于stack exchange，提问作者Luiz Jr