javascript - 背景页面中是否有相当于 `run_at: start` 的内容？

Question

在正在加载的页面上执行任何其他代码之前，我需要运行一些 JavaScript 代码。

使用这样的内容脚本效果很好:

{
  "matches": ["http://*/*", "https://*/*", "file://*/*"],
  "js": ["contentScript.js"],
  "run_at": "document_start"
}

但现在我只想在用户通过单击浏览器操作按钮选择的某些页面上运行内容脚本。

我试过听 chrome.tabs.onUpdated 然后调用 executeScript，但是其他代码在我的内容脚本之前在页面上运行。

有没有办法保证后台页面注入(inject)的代码先于其他代码运行？

我也可以在我的内容脚本中添加一个条件，但这意味着我需要访问当前的 tabId 和我的扩展被激活的所有选项卡的列表。

Answer 1

根据文档chrome.tabs.executeScript有几个有用的参数，包括 runAt (默认情况下它是 document_idle ，发生在 DOMContentLoaded 事件之后)，所以要尽快注入(inject)脚本使用 runAt: 'document_start' .

chrome.tabs.executeScript(tabId, {
    runAt: 'document_start',
    code: 'console.log(document.documentElement.innerHTML);',
});

注意 DOM 树在此阶段通常是空的，特别是如果您从早期执行的事件监听器(例如 tabs.onUpdated 或 webNavigation.onCommitted)注入(inject)。甚至 HEAD 或 BODY 元素可能仍然不存在，因此您必须使用 (document.head || document.documentElement)作为任何添加节点的容器回退，例如 <style>或 <script> .