Chrome插件contentscript怎么调用目标页面的js函数和触发页面点击？

其实是不能调用目标页面的js函数的，也不能访问变量，这点在官方文档里面已经说明了。

详情点击https://developer.chrome.com/extensions/content_scripts#execution-environment

那么怎么去触发目标页面比如按钮的点击事件呢，其实还是有办法的。思路就是用js模拟鼠标点击事件。下面附上源码可参考。

function invokeEle(ele) {
  const event = document.createEvent("MouseEvents");
  const rect = ele.getBoundingClientRect();

  const randomX = parseInt(Math.random() * rect.width);
  const randomY = parseInt(Math.random() * rect.height);
  const randomMenu = parseInt(Math.random() * 200);
  const screenX = rect.left + randomX;
  const screenY = rect.top + randomMenu + randomY;
  const clientX = rect.left + randomX;
  const clientY = rect.top + randomY;

  event.initMouseEvent(
    "click",
    true,
    true,
    window,
    1,
    screenX,
    screenY,
    clientX,
    clientY,
    false,
    false,
    false,
    0,
    null
  );
  ele.dispatchEvent(event);
}

比如你要触发以下这个按钮

<button id="btn">Hello</button>

const btn = document.getElementById("btn");
invokeEle(btn);