Dynamic javascript loading and execution

Question

I'm trying to dynamically load a Javascript based on the return value of an API call. I dynamically insert the script tag but it does not get executed. Can someone help understand why? The relevant code snippet is pasted below

onError: function(code) {
      if(code == "false") {
        var headID = document.getElementsByTagName("head")[0];
        var scriptTag = document.createElement("script");
        scriptTag.type="text/javascript";
        scriptTag.src= 'scriptURL';
        headID.appendChild(scriptTag);
      }
}

Using firebug/chrome inspector, I can see that the script tag is added to the dom but the script is not executed (at least not that I can determine). It is a 3rd Party script hence I do not have direct control over it and hence cannot modify it either.

Is it loaded correctly? Take a look on the network panel. If it does, are any syntax or runtime errors thrown into the console? — Bergi, Aug 01 '12 at 23:46
Does the script contain code that should do something immediately, or does it define functions that you would need to explicitly call from your own code? If you replace the third-party script with your own simple `test.js` containing just `alert("I'm loaded");` what happens? — nnnnnn, Aug 01 '12 at 23:47
If you can't determine whether it has been loaded or not, you might want to try and create a new JavaScript file having a console log and changing the script URL to point to such. — JCOC611, Aug 01 '12 at 23:48
There are no errors in the console but the network tab does not show it being loaded either (which is what I'm trying to figure out :) ) — AJ., Aug 01 '12 at 23:48
@nnnnnn It should execute immediately and not require explicit function calls — AJ., Aug 01 '12 at 23:50
So I tried with a simple script file which contains a simple alert and that alert is showing up fine — AJ., Aug 01 '12 at 23:55
It's a JS file hosted on another domain (can that be a reason - Cross domain script loading?) — AJ., Aug 01 '12 at 23:55
@AJ. Which browser are you testing with? FF and Chrome? I tested with FF, appending script child like you did on a button click, using a .js file with `alert()' and it worked. — Nick Rolando, Aug 02 '12 at 00:02
Cross-domain script should be OK, and your test script with an alert worked so the dynamic add mechanism seems OK. What happens if you just include the third-party script directly (statically) on your page? — nnnnnn, Aug 02 '12 at 00:06
@Shredder Chrome. And as I said, using a simple test script, it works. But the test script was on the same domain as the web page. The actual script is on a different domain which might be the issue — AJ., Aug 02 '12 at 00:08
@nnnnnn the script loads fine and executes as expected (it's for an ad network and displays the ad) — AJ., Aug 02 '12 at 00:10

score 1 · Accepted Answer · answered Aug 09 '12 at 15:46

After reading the comments below the question it seems that the third party script is doing its job on window.onload event. Many programmers use this style.

window.onload = function() {
    // Whatever task
};

If the onload event of your page has already been fired before you add the script tag dynamically, the 'Whatever task' code would never execute.

Check the source of the third party script. If it uses window.onload, you can try calling window.onload(); after you add the script tag dynamically.

Dynamic javascript loading and execution

1 Answers1