Dynamically loading Java Script files

Question

I would like to know if there is a way to dynamically load some JS files before "$(document).ready" gets called. These JS files should be loaded and available in the ready event handler.

Does jquery provide a way to do this?

The issue here (as you might expect) is the ability to load a specific localized version of my JS files depending on whichever locale/language is selected.

Thanks

• cheeken: If you've found them helpful, please accept to your previous questions.

Answer 1

If you want in pure javascript you can try this.

 var head= document.getElementsByTagName('head')[0];
 var script= document.createElement('script');
 script.type= 'text/javascript';
 script.onreadystatechange= function () {
 if (this.readyState == 'complete'){
 //Your can write your code here
 };
 }
 script.src= 'script.js';
 head.appendChild(script);

Alertnatively you can use jQuery's getScript method

$.getScript("script.js", function(){
 //Your can write your code here
});

• rqtechie: Is this synchronous or asynchronous. In other words after the call to "$.getScript("script.js");" is the script from that js available in the very next line? Or should we have to wait for the callback function to execute?

Answer 2

Try this:

jQuery.getScript("url here")

http://api.jquery.com/jQuery.getScript/