Loaded jquery file in content_script in chrome extension does not work

Question

I am new to this development of Chrome extension plugins. I am developing a new new plugin using this chrome extension.

My requirement is to load the jquery.js file into the content of the script if it does not have this js file (for Ex: I check the jquery.js file, fancybox.js file, and if it does not load these files.)

When I implement this logic in the content of the script, it loads the jquery.js file. After that, it does not work in the script content. It shows $ (or) jQuery undefined. For each time, it is loaded, but not executed in the contents of the script.

Here is the code I implemented.

document.getElementById('someid').onclick = loadJs(); function loadJS() { if(tyof jQuery == undefined || tyof jQuery != 'function' ) { var jqscript = document.createElement('script'); jqscript.type = 'text/javascript'; jqscript.async = true; // Src of the script jqscript.src = "......url to jquery.js file.............."; // Check whether script is loaded or not jqscript.onload=function(){ if ((!this.readyState || this.readyState == "loaded" || this.readyState == "complete")) { console.log("Script loaded - "); // It is showing error here alert(typeof jQuery); } }; // Get the document header var head = document.getElementsByTagName('head')[0]; // Add script to header - otherwise IE complains head.appendChild(jqscript); } } 

Please suggest about it.

Thanks.

Answer 1

Chrome extensions do not have access to scripts downloaded and used by web pages.

Google invokes these isolated worlds:

http://code.google.com/chrome/extensions/content_scripts.html

You can not...

Use variables or functions defined by their extension pages

Use variables or functions defined by web pages or other content scripts.

So, no matter what scripts you have. The important thing is that you include the scripts that you need in the manifest:

 "content_scripts": ['jquery.js', 'myScript.js', 'optionsScript.js'], 

The order of the list matters, so if your script uses jquery, then it should be preceded by jquery.js.