Question

我正在尝试使用Google Chrome扩展程序的内容脚本方法注入我的代码。这仅在我的清单没有弹出页面且我的background.html具有此功能时才有效：

chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
chrome.tabs.executeScript(null, { file: "content_script.js" });
});
});

如果在使用PoPup页面时每次在chrome中加载新页面时，如何触发此代码？因为到目前为止，唯一可行的方法是点击扩展程序的浏览器操作按钮。

同样在清单的内容脚本部分，我已经包含了所有这些：

"content_scripts": [
{

"matches": ["http://jquery.com/*"],
"all_frames":true,
  "js": ["jquery.js","jquery-ui.min.js","content_script.js"],
   "run_at": "document_end"
}
],

Answer 1

简答：在后台页面中使用chrome.tabs.onUpdated.addListener代替chrome.browserAction.onClicked.addListener，每次更新页面时都会加载内容脚本。

答案很长： CAN 实际上是一个内容脚本，当它们是一个弹出页面时，可以通过从清单中包含内容脚本或使用程序化注入来加载从背景页面（如您在问题中所建议的那样）。

从清单中：

{
  "name": "My extension",
  ...
  "content_scripts": [
    {
      "matches": ["http://myurl.com/*"],
      "css": ["mystyles.css"],
      "js": ["jquery.js", "myscript.js"]
    }
  ],
  "permissions": [
     "http://myurl.com/*",
     "tabs"
  ],
  "background_page": "background.html",
  "browser_action": {
     "popup": "popup.html"
  }
  ...
}

确保“matches”属性与您要加载内容脚本的页面的URL匹配。

使用程序化注入：

您可以使用您在问题中建议的方式，在单击浏览器操作时插入内容脚本或您可以在每次更新浏览器URL时执行此操作：

chrome.tabs.onUpdated.addListener(function() {
  chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
    chrome.tabs.executeScript(null, { file: "content_script.js" });
  });   
});

如何在有弹出页面时加载页面时注入内容脚本？

1 个答案:

从清单中：

使用程序化注入：