loading new JavaScript after the web page is loaded

[www.gerardvignes.com]

I am using this to load the client JavaScript for a web application
when it is selected by the user) via an Ajax connection to the server.

I have found only two ways of loading new JavaScript after the web page
is loaded.

1. Create a new script element (where head is the id of the head tag):
var s = document.createElement('script');
s.setAttribute('type','text/javascript');
s.setAttribute('src', 'scripts/myscript.js');
s.setAttribute('defer', false);
document.getElementById('head').appendChild(s);

2. eval() of a string sent from the server via XmlHttpRequest.

The first method does not work with Apple Macintosh Safari. There is an
article on the apple support website
http://lists.apple.com/archives/Webc.../msg00024.html

Does anyone know of any other methods that are cross-browser?

I already know about the IFrame workaround, but I have not been able to
determine if that is really portable and practical. Does anybody have
experience with this?

Thanks,

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA

[Randy Webb]

www.gerardvignes.com said the following on 12/23/2006 9:55 PM:

I am using this to load the client JavaScript for a web application
when it is selected by the user) via an Ajax connection to the server.

I have found only two ways of loading new JavaScript after the web page
is loaded.

1. Create a new script element (where head is the id of the head tag):
var s = document.createElement('script');
s.setAttribute('type','text/javascript');
s.setAttribute('src', 'scripts/myscript.js');
s.setAttribute('defer', false);
document.getElementById('head').appendChild(s);

That is not the best way to load a script after the page has loaded when
using a .js file. Search the archives for the word "loadJSFile".

2. eval() of a string sent from the server via XmlHttpRequest.

The first method does not work with Apple Macintosh Safari. There is an
article on the apple support website
http://lists.apple.com/archives/Webc.../msg00024.html

Never have seen that article but I did know, before now, that loading a
..js file on the fly in Safari doesn't work (It doesn't support setting
the .text property of a script block either).

Does anyone know of any other methods that are cross-browser?

Safari supports .createTextNode with a script block. If you are
retrieving the .js file via an AJAX request, then you can read the
contents and use createTextNode to inject it into the page. Check the
archives for a post entitled "createTextNode and IE7"

<URL:
http://groups-beta.google.com/group/comp.lang.javascript/browse_thread/thread/7e23f42490c301de/54a4c31200e06b0d?lnk=gst&q=createTextNode+IE&rnum= 1#54a4c31200e06b0d>

And you can read about the different ways to inject scripts, what
browsers support it, and what browsers don't support the different methods.

I already know about the IFrame workaround, but I have not been able to
determine if that is really portable and practical. Does anybody have
experience with this?

IFrame was the pre-AJAX way of doing it. It is very widely supported.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[www.gerardvignes.com]

Thanks Randy!

I appreciate your response. I am looking at your solutions. I'm glad
there are other options.

Gerard Vignes
http://www.GerardVignes.com
Seattle, WA