If you're just trying to load a stylesheet dynamically, all you need to do
is this:
function addSheet( url, doc ) {
doc = doc || document;
var link = doc.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = url;
doc.getElementsByTagName('head')[0].appendChild( link );
}
Similarly, you can load a script with:
function addScript( url, doc ) {
doc = doc || document;
var script = doc.createElement( 'script' );
script.type = 'text/javascript';
script.charset = 'utf-8';
script.src = url;
doc.getElementsByTagName('head')[0].appendChild( script );
}
-Mike
> > I'm trying to develope a small piece for dynamic loading in jquery,
> > wich loads the .js and .css source files on the fly without any
> > special markup in the html page.
>
> For .js files you can use jspax (www.jspax.org). I use it to
> load jQuery and plugins on demand (actually I made it for
> that purpouse at the beginning).
> For .css I just had that question from a friend of mine and
> made a small set of jsPax-packages for him:
>
> ---cssloader.js
> $using('xBrowser.simulateXMLHttpRequest',function() {
> $package('cssloader', {
> base: '/',
> load: function(css) {
> var x = new XMLHttpRequest();
> x.open('GET',cssloader.base+css+'.css');
>
> x.onload = function() {
> var e = document.createElement("style");
> e.type="text/css";
>
> e.appendChild(document.createTextNode(x.responseText));
> document.getElementsByTagName("head")
> [0].appendChild(e);
> };
> x.send('');
> }
> });
> });
> ---
>
> ---xBrowser/simulateXMLHttpRequest.js
> var impl = 'native';
> if( !window.XMLHttpRequest ) impl =
> (window.ActiveX)?'activex':'iframe';
> $using('xBrowser.simulateXMLHttpRequest.'+impl,function() {});
> ---
>
> ---xBrowser/simulateXMLHttpRequest/native.js:
> $package('xBrowser.simulateXMLHttpRequest.native',{});
> ---
>
> ---xBrowser/simulateXMLHttpRequest/activex.js:
> var lib = /MSIE 5/.test(navigator.userAgent) ? "Microsoft" :
> "Msxml2"; window.XMLHttpRequest = function() {
> var rval = new ActiveXObject(lib + ".XMLHTTP");
> rval.onreadystatechange = function() {
> if(x.readystate == 4) rval.onload();
> };
> return rval;
> };
> $package('xBrowser.simulateXMLHttpRequest.activex',{});
> ---
>
> use them like this:
>
> $using('cssloader', function(){
> cssloader.base='https://www.example.com/styles/';
> cssloader.load('mywonderfull');
> ...
> });
>
> I have not tested the code, but he did not complain up to now ;-)
>
> > The problem is that it seems that the browser doesn't wait
> until the
> > script (the plugin) is finished loading
>
> Yes, you are using assynchronous XMLHttpRequests. JsPax does
> that as well, but it can cope with that by usein callback
> functions. JSAN does use synchronous XMLHttpRequests to
> circumvent that problem.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
