在 Chrome 扩展中执行 DOM 之前需要帮助将脚本注入到页眉

如何解决在 Chrome 扩展中执行 DOM 之前需要帮助将脚本注入到页眉

我们正在开发一个开源 Chrome 扩展程序：数字助理客户端

在页面开始使用“内容脚本”和“run_at”加载dom之前，我试图将脚本注入带有chrome扩展名的网页：document_start。但似乎页面 dom 在注入我的脚本之前正在加载。我正在清单版本 2 中执行此操作。

在 manifest.json 中我这样声明

{
  "matches": ["*://*"],"js": ["js/injectscriptmodifier.js"],"all_frames": false,"run_at":"document_start"
},

Injectscriptmodifier.js 包含以下代码

var s = document.createElement('script');
var scriptpath = chrome.extension.getURL('js/links.js');
s.src = scriptpath;
s.onload = function() {
};
(document.head || document.documentElement).appendChild(s);

并且 links.js 有 mutationobserver 和 addeventlistner 修改来捕获页面具有的可点击链接和按钮

EventTarget.prototype.addEventListener = function (addEventListener) {
    return function () {
        if (arguments[0] === "click") {
            UDAAddNewElement(this);
        }
        addEventListener.call(this,arguments[0],arguments[1],arguments[2]);
    }
}(EventTarget.prototype.addEventListener);

var UDAObserver = new MutationObserver(UDADomMutations);
// starting the mutation observer
UDAObserver.observe(document,{
    childList: true,subtree: true
});

当页面加载时，一些可点击的链接/按钮没有被捕获，当我检查第一个检测到的对象时，它显示在页面中间的某个地方。我怀疑 "run_at": "document_start" 并没有停止首先执行的 dom。有时，当我刷新时，脚本会被正确注入并且扩展程序按预期工作。

最初，我尝试使用 chrome 执行脚本，该脚本在后台脚本中的 document_idle 上运行，如下所示。但是，当解析 dom 并且我们已转移到内容脚本包含类型时，我们无法检测到可点击对象。

chrome.tabs.executeScript(tabs[0].id,{
file: "UDAPluginSDK.js",runAt: "document_idle",},function() {});

我们的扩展需要将一些脚本加载到页面上以执行节点操作，例如将实际节点对象转换为 json 数据并向页面本身添加一些 UI，如下所示，右侧面板已打开。为了做到这一点，我们向页面注入了一个 sdk，它将 HTML 添加到实际页面并改变页面外观。请查看我们的面板如何显示在右侧，如下面的屏幕截图所示。

screenshot

如果我们转向孤立的世界语境，那么有两个问题

1. 使用 postmessage 将 domnode 从一个脚本传递到另一个脚本
2. 未将脚本和 css 注入页面。

谁能告诉我我们是否应该只使用孤立的内容脚本来消除加载脚本的延迟，或者有什么替代方法吗？