如何创建可模拟Selenium操作的基础JavaScript书签脚本

这是零依赖的原生JS骨架，完全匹配XPath定位、顺序执行、步骤等待、常用表单操作的需求，不需要安装任何插件/油猴脚本，存到书签栏就能直接用，适配重复填写固定表单的场景。

内置核心能力 #

和你给出的伪代码逻辑完全对齐，同时做了现代前端框架兼容（输入、勾选操作会触发原生事件，避免React/Vue类站点识别不到操作）：

• xpathClick(xpathExpr)：通过XPath定位元素并触发点击
• xpathEnter(xpathExpr, text)：通过XPath定位输入框，填入指定固定文本
• xpathCheck(xpathExpr)：通过XPath定位单选/复选框，未选中时自动勾选
• wait(ms)：设置步骤间等待时长，单位为毫秒

可直接修改的完整源码 #

你只需要在runAutomation函数里替换成自己的操作步骤即可：

(function(){
  // 工具函数：XPath匹配单个元素，逻辑和Selenium findElement一致
  function getElementByXPath(xpath) {
    return document.evaluate(
      xpath,
      document,
      null,
      XPathResult.FIRST_ORDERED_NODE_TYPE,
      null
    ).singleNodeValue;
  }

  // 等待函数，支持链式调用避免回调嵌套
  function wait(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
  }

  // 操作：XPath定位点击
  async function xpathClick(xpath) {
    const el = getElementByXPath(xpath);
    if (!el) throw new Error(`定位元素失败：${xpath}`);
    el.click();
  }

  // 操作：XPath定位输入文本（兼容现代框架）
  async function xpathEnter(xpath, text) {
    const el = getElementByXPath(xpath);
    if (!el) throw new Error(`定位元素失败：${xpath}`);
    el.focus();
    el.value = text;
    // 触发原生事件保证框架能识别到输入
    el.dispatchEvent(new Event('input', { bubbles: true }));
    el.dispatchEvent(new Event('change', { bubbles: true }));
    el.blur();
  }

  // 操作：XPath定位勾选单选/复选框
  async function xpathCheck(xpath) {
    const el = getElementByXPath(xpath);
    if (!el) throw new Error(`定位元素失败：${xpath}`);
    if (!el.checked) el.click();
  }

  // 👇 在此处替换为你自己的自动化步骤
  async function runAutomation() {
    await xpathClick("//button[@class='buy']");
    await wait(2000); // 等待2秒
    await xpathEnter("//*[@class='name']", "John Smith");
    await wait(2000);
    await xpathCheck("//*[@class='agrees']");
    alert("表单自动填写完成");
  }

  runAutomation().catch(err => console.error("自动化执行报错：", err));
})();

转为书签使用的方法 #

1. 把代码里的步骤替换为你自己的表单操作逻辑后，将代码压缩为单行，在最前面加上javascript:前缀
2. 打开浏览器书签管理器，新建书签，名称可自定义（比如「自动填固定表单」），网址栏粘贴处理好的代码后保存
3. 打开需要操作的目标页面，点击对应书签就会按顺序执行你预设的操作

调整提示 #

• 等待时长可以按页面实际加载速度修改，比如页面响应慢就把wait(2000)改为wait(3000)即等待3秒
• 需要新增操作时，直接在runAutomation函数里按顺序加await 操作名(参数)即可，XPath写法和你用Selenium时的规则完全一致
• 如果出现定位失败的问题，打开浏览器控制台查看报错信息，调整对应XPath即可

内容的提问来源于stack exchange，提问作者d-b