I'm injecting my content script from the background page when the user clicks the browser action button, like so:
chrome.browserAction.onClicked.addListener(function (tab) {
chrome.tabs.executeScript(null, { file: "content.js" });
});
So how can I access jQuery from inside my content.js? I don't see a way to inject that simultaneously.
What about:
chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
chrome.tabs.executeScript(null, { file: "content.js" });
});
You can download "jquery.js" from here: http://jquery.com/download/
How about adding this to your manifest file
"content_scripts": [
{
"js": [
"jquery.js",
"contentscript.js"
]
}
],
UPDATE:
Execute second script after the first one would be more accurate in terms of script order, result is an array of results of execution of the script in list of tabs.
chrome.tabs.executeScript(null, {file:'js/jquery-2.1.1.min.js'}, function(result){
chrome.tabs.executeScript(null, {file:'js/myscript.js'});
});
OLD:
Injecting Jquery followed by your script will gives ability to access Jquery within your script.
chrome.tabs.executeScript(null, {file:'js/jquery-2.1.1.min.js'});
chrome.tabs.executeScript(null, {file:'js/myscript.js'});
You have more control over how the script should be injected as described in here. Specially allFrames property is important if you wish to inject script to all the frames within the document. Ignoring it will only injected into the top frame. Since it is not mentioned in other answers guess it helps you. Scripts can be injected always by adding it to manifest as described here.