Multiple external JavaScripts question.

[Naild]

Hello everyone,

I'm having alot of problems figuring out how to link to multiple external JavaScripts within another script. I've been successful with CSS, but the JavaScript has me baffled. The CSS I used is this:

<script type="text/javascript">
<!--
var stylesheet=new Array(); stylesheet[0]='';

stylesheet[1]="URL of default.css";
stylesheet[2]="URL of skin2.css";
stylesheet[3]="URL of skin3.css";

for(i=1;i<stylesheet.length;i++){
    if(pb_skinid==i){
        document.write('<link rel="stylesheet" type="text/css" href="'+stylesheet[i]+'" />');
        break;
    }
}
// -->
</script>

What this script does is reference different CSS files for different forum skins (A forum much like this one).

Does anyone have any idea's on how to do this with JavaScript files? I've tried everything I know how, like changing 'stylesheet' in the script to 'script' and even 'script src'. I'm completely STUMPED.


Heeeeeeelp.

[jscheuer1]

First you need to know the correct way to call an external script:

<script src="somejavascript.js" type="text/javascript"></script>

Then you have to have the bright idea that hey, if I put something like that in a document.write statement, the '</script>' part will end the script. Two ways to get around it:

<script type="text/javascript">
document.write('<script type="text/javascript" src="motiongallery.js"><\/script>')
</script>

and

<script type="text/javascript">
document.write('<script type="text/javascript" src="motiongallery.js"></sc\
ript>')
</script>

[Naild]

Thank you very much John I really appreciate it. One last question though. What do I use to declare the variable? Should I put var script?

This is what I currently have that doesn't work:

<script type="text/javascript">
<!--
var script=new Array(); script[0]='';

script[1]='DEFAULT.js';
script[2]='SKIN1.js';

for(i=1;i<script.length;i++){
if(pb_skinid==i){
document.write('<script src='' language='javascript' type='text/javascript' href="'+script[i]+'" />');
break;
}
}
// -->
</script>


The 'stylesheet' part of the script was a no brainer for CSS, but I don't know the variable for a external JavaScript.

[Naild]

I left the URL's generic on purpose. Just thought I would let you know.


Thanx

[jscheuer1]

This:

document.write('<script src='' language='javascript' type='text/javascript' href="'+script[i]+'" />');

will not write anything because of the unescaped single quotes.

Go back to my first post and see how to write a proper external script call without the document.write part first. The language attribute is no longer used, it has been deprecated. The attribute 'href' is not part of an external script call. The 'src' attribute is set to the path and filename of the external script.

[mwinter]

<script type="text/javascript">
<!--

Omit the SGML comment (both here and the closing, later). It's unnecessary.

var stylesheet=new Array(); stylesheet[0]='';

Why are you trying to force the use of one-based indices? Start the loop from zero and use the same condition. But, that said...

document.write('<link rel="stylesheet" type="text/css" href="'+stylesheet[i]+'" />');

Don't do that, unless you really want a script-disabled user agent to render the document with no style sheet whatsoever. See another recent thread to see how to do this properly.

[...] </sc\ript>')

That would be wrong, though. User agents are allowed to stop at ETAGO (</), or thereabouts. The first approach you suggested (<\/) is the best way.

Mike

[jscheuer1]

Originally Posted by jscheuer1
[...] </sc\ript>')

Once again, I didn't post that! I posted this:

</sc\
ript>')

There is a big difference!

[Twey]

But if the browser stops parsing the script at </, it's still not going to work whether you have the linebreak there or not.

[jscheuer1]

But if the browser stops parsing the script at </

Why would it? Mine (IE6, NS7.2 & FF1.0.4) don't. Maybe Safari does?

[Twey]

Don't ask me, it's what Mike said.
I agree that I've never come across anything that does it (not that I've investigated heavily).