Dynamically include external Javascript file

Question

So I need to dynamically call and execute the javascript code generated from external php file. This is what I have:

<script type="text/javascript">
id = <some id calculation>;
var code_url = 'http://example.com/javascript.php?id=' + id; // this generates the javascript desired

var code_div = document.getElementById("code_div"); // where I want to insert the JS
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", code_url);
code_div.appendChild(fileref);
}
</script>

Now the div with the javascript link does show up, but it doesn't seem to execute. I tried going through other similar questions on StackOverflow and other places, but that's as far as it got me. Any idea why it's not executing?

UPDATE: Fixed the missing quote. Also I should've mentioned I placed the code inside the body. I don't have access to the HEAD in my case, and I need to insert the Analytics code

If that was really what you had, then the div wouldn't show up as the script would error on line one because you forgot the closing quote for the string. — Quentin
– Quentin, Commented Jul 27, 2011 at 6:43
Oh no sorry... it was error when I edited to script to post it. — Bashar Abdullah
– Bashar Abdullah, Commented Jul 27, 2011 at 9:24

RobG · Accepted Answer · 2011-07-27 07:18:48Z

3

The code should cause the code in the script element to be executed (once the missing quote on line 1 is added), are you sure that's exactly what you have in your page? e.g. the following works:

window.onload = function() {
  var s = document.createElement('script');
  s.type = 'text/javascript';
  s.src = '_foo.js';
  document.body.appendChild(s);
}

in _foo.js:

alert('loaded');

answered Jul 27, 2011 at 7:18

RobG

148k32 gold badges180 silver badges216 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bashar Abdullah Over a year ago

Thanks. tried the window.onload. If I place alert() inside the function, it executes, and the _foo.js alone executes properly. I should note I'm adding dynamic id to the javascript url, forgot to mention that. Does it create problem? The output I get eventually is <div id="script"> <script type="text/javascript" src="http://example.com/javascript.php?id=123"> </script> </div>

RobG Over a year ago

Adding a search string to the URL should have no effect in the browser other than maybe affecting caching of the resource.

Tu Tran · Accepted Answer · 2011-07-27 07:02:47Z

2

After fixing mistakes (such as missing function declaration, closing quote in your code), make sure your code_url reference to a page which has a function calling or an event;

Ex:

function needToExecute() {
    ...
}

needToExecute();

answered Jul 27, 2011 at 7:02

Tu Tran

1,9971 gold badge29 silver badges51 bronze badges

2 Comments

Bashar Abdullah Over a year ago

Thanks. Tried that and it didn't work. Not sure if I'm doing something wrong, but this is the output it spits out: <div id="script"> <script type="text/javascript" src="http://example.com/javascript.php?id=123"> </script> </div> NOTE: I forgot to mention I am attaching dynamic id to the url. Shouldn't make difference to the javascript call should it? If I run the javascript in separate page, it generates the correct output

Bashar Abdullah Over a year ago

Sure... Here is my simple attempt. It works if I go to the url directly. <script type="text/javascript"> function sayHi() { alert('hi mecca'); } sayHi(); </script>

toopay · Accepted Answer · 2011-07-27 06:41:14Z

2

Take a look at : http://headjs.com/

answered Jul 27, 2011 at 6:41

toopay

1,62311 silver badges18 bronze badges

Collectives™ on Stack Overflow

Dynamically include external Javascript file

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related