Google Chrome扩展程序:如何在以编程方式注入的内容脚本中包含jQuery？

Question

当用户单击浏览器操作按钮时,我从后台页面注入我的内容脚本,如下所示:

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

那么如何从我的内部访问jQuery content.js？我没有看到同时注入的方法.

Answer 1

关于什么:

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

你可以从这里下载"jquery.js":http://jquery.com/download/

Answer 2

如何将其添加到清单文件中

"content_scripts": [
    {
        "js": [
                "jquery.js", 
                "contentscript.js"
            ]
    }
],

Answer 3

更新：

在第一个脚本之后执行第二个脚本在脚本顺序方面会更准确，result是选项卡列表中脚本执行结果的数组。

chrome.tabs.executeScript(null, {file:'js/jquery-2.1.1.min.js'}, function(result){
    chrome.tabs.executeScript(null, {file:'js/myscript.js'});
});

老的：

在脚本中注入 Jquery 将能够在脚本中访问 Jquery。

chrome.tabs.executeScript(null, {file:'js/jquery-2.1.1.min.js'});
chrome.tabs.executeScript(null, {file:'js/myscript.js'});

您可以更好地控制如何注入脚本，如此处所述。allFrames如果您希望将脚本注入到文档中的所有框架中，属性尤其重要。忽略它只会注入到顶部框架中。由于其他答案中没有提到，猜测它对您有帮助。始终可以通过将脚本添加到清单中来注入脚本，如此处所述。