Question

I find this excellent code, posted by aemkei as answers to this questions:

1. How do you dynamically load a javascript file? (Think C’s #include)
2. Use javascript to inject script references as needed?

You may write dynamic script tags (using Prototype):

new Element('script', {src: 'myBigCodeLibrary.js', type: 'text/javascript'}); 

The problem here is that we do not know when the external script file is fully loaded.

We often want our dependant code on the very next line and like to write something like:

if (iNeedSomeMore){   Script.load('myBigCodeLibrary.js');  // includes code for myFancyMethod();   myFancyMethod();                     // cool, no need for callbacks! } 

There is a smart way to inject script dependencies without the need of callbacks. You simply have to pull the script via a synchronous AJAX request and eval the script on global level.

If you use Prototype the Script.load method looks like this:

var Script = {   _loadedScripts: [],   include: function(script){     // include script only once     if (this._loadedScripts.include(script)){       return false;     }     // request file synchronous     var code = new Ajax.Request(script, {       asynchronous: false, method: 'GET',       evalJS: false, evalJSON: false     }).transport.responseText;     // eval code on global level     if (Prototype.Browser.IE) {       window.execScript(code);     } else if (Prototype.Browser.WebKit){       $$('head').first().insert(Object.extend(         new Element('script', {type: 'text/javascript'}), {text: code}       ));     } else {       window.eval(code);     }     // remember included script     this._loadedScripts.push(script);   } }; 

I found that, the code does not work on IE if the all of them is executed in ‘file://’ protocol, however, it is not the problem since its use case involved real web application.

I tried it once to include http://www.google-analytics.com/urchin.js by google, but from one of web page, but it looks like it cannot request javascript file from different domain.

How we could dynamically add javascript, just like what above scripts does, but from another domain?

Answer 1

The security model in modern browsers prevents JavaScript from making cross-domain requests. That has holes (see every website exploit since the beginning of the internet), but using them is more than a little shady and it’s only a matter of time before they’re patched.