Getting IE to load a different js file

Question

Trying to get a page to load a different js file if the browser is IE, but a different one if it is any other browser. I've corrupted this, but it won't work, does anyone have any ideas?

Any help is appreciated:

<script type="text/javascript">
var ie = false;
</script>
<!--[if IE]>
<script type="text/javascript">
ie = true;
</script>
<![endif]-->
<script type="text/javascript">
if(ie == false)
{ 
document.write ("<script src="js/moreskins.js" type="text/javascript">")</script>;
} else {
    document.write ("<script src="js/ieskins.js" type="text/javascript">")</script>;
}
</script>

As [@Teemu noted](http://stackoverflow.com/a/17125763/363701), IE10 doesn't support conditional comments. [@UmairP's Answer](http://stackoverflow.com/a/17125702/363701) is probably the best approach for targeting IE<10, rather than the code in your Question. But browser detection in general should be your last choice if all else fails. Try to code it an X-browser way, or use feature dectection. Mind if I ask why you're doing this in the first place? — Zach Lysobey, Jun 15 '13 at 16:56
@ZachL Well, this is one of those very few situations, where `document.write()` can be used, let's not ruin the fun ; ). Anyway, the edited part of UmairP's answer really is the approach OP should use, I just pointed out, what makes OP's code not to work... — Teemu, Jun 15 '13 at 17:03
@ZachL I was using it to fix a rendering bug in the IE Canvas tag. I've just put a couple of clocks on a site I was building, but in IE it renders the lines far thinner than every other browser, so I fixed it with loading an IE specific javascript with thicker lines. Using CoolClock. — James J, Jun 15 '13 at 19:08
@JamesJ ah, I see. That *does* look all messed up in IE. You may consider, however, that future versions of IE may not have this same "bug" so this conditional logic may be setting yourself up for future problems. If I were you, I would probably just choose a different clock. CoolClock hasn't been updated in over 3 years (and that was just some fixes on top of the 2007 codebase. I'm sure there's something better out there that is better maintained and which doesn't require Hacks or Browser detection. — Zach Lysobey, Jun 15 '13 at 20:09
Well, not as easy to find such a clock as I thought, but I did find this one: http://jsfiddle.net/molokoloco/V2rFN/ — Zach Lysobey, Jun 15 '13 at 20:15

score 4 · Accepted Answer · answered Jun 15 '13 at 17:16

4

Looks like your last script tag is a little jumbled, plus as Teemu mentioned, IE10 does not support conditional HTML comments.

If you really need to target IE, I would check the user agent for "MSIE":

<script type="text/javascript">
  var ie = !(navigator.userAgent.indexOf("MSIE")<0);
  if(ie == false) { 
    document.write ("<script src=\"js/moreskins.js\"></scr"+"ipt>");
  } else {
    document.write ("<script src=\"js/ieskins.js\"></scr"+"ipt>");
  }
</script>

answered Jun 15 '13 at 17:16

benbrunton

980
10
18

This worked a treat, thank you Ben, did exactly what I needed. – James J Jun 15 '13 at 18:20
@Teemu I couldn't get it to. Might have been me being thick about it lol sorry, this one just got exactly what I wanted in a simplified form. – James J Jun 15 '13 at 19:10
Might want to remember that indexOf isn't supported in IE8 or earlier. – Joel Cochran Jun 17 '13 at 12:11
It's not supported for arrays but is for strings [even in earlier versions of IE](http://msdn.microsoft.com/en-us/library/ie/53xtt423(v=vs.94).aspx) – benbrunton Jun 17 '13 at 12:24
Hi Ben, what is the <0 at the end there? Can I use that to check IE versions less than 9 maybe? – Nov 29 '18 at 09:33

U.P · Answer 2 · 2013-06-15T16:56:52.660

3

Use conditional comments to load file in IE and ignore in other browsers.

<!--[if IE]>
   <script src="js/ieskins.js" type="text/javascript">
<![endif]-->
<![if !IE]>
   <script src="js/moreskins.js" type="text/javascript">
<![endif]>

Note: the else part (<![if !IE]>) which is not a comment. So for IE it is else part and for other browsers, it is nothing.

EDIT

you can also try the following instead of document.write

var script = document.createElement('script');
   script.src = "js/moreskins.js";
   document.getElementsByTagName('head')[0].appendChild(script);

edited Jun 15 '13 at 16:56

answered Jun 15 '13 at 16:32

U.P

7,357
7
39
61

Tried that Umair, but it won't pick up the first one in IE or its over-riding it with moreskins and I'm not sure why, its why I went for the coded approach – James J Jun 15 '13 at 16:45
just thought of something: you _need_ an explicit closing `` tag ALWAYS, otherwise they don't work. It's silly and seems unnessecary, but thats how it works. Perhaps thats why James's *conditional comment* approach didn't work. – Zach Lysobey Jun 15 '13 at 17:07

Teemu · Answer 3 · 2013-06-15T19:05:28.007

3

The problem here is the closing script tag. When using document.write() to add scripts, you need to cut end tag into pieces. Something like below (notice the fixed quoting and parenthesing too).

document.write('<script src="js/moreskins.js" type="text/javascript"></scr' + 'ipt>');

Script execution is stopped, when parser founds the first literal end tag, that's why you need to cut it in the argument.

Also notice, that IE10 doesn't support conditional comments, you should rather use feature detection instead of browser detection.

edited Jun 15 '13 at 19:05

answered Jun 15 '13 at 16:40

Teemu

22,918
7
53
106

Do you have a reference on that "cut end tag into pieces" thing? I never heard about that (but I never use `document.write()`) ;-) – Zach Lysobey Jun 15 '13 at 17:10
@ZachL Seems not to found at MDN nor MSDN, I'll work on this later, and will post a comment when I find a something. – Teemu Jun 15 '13 at 17:23
@ZachL In meanwhile you can try it yourself, writing a script with `document.write()` really doesn't work with literal `` in the argument. – Teemu Jun 15 '13 at 17:31
Very true. And very interesting. I found this, which satisfied me: http://stackoverflow.com/questions/236073/why-split-the-script-tag-when-writing-it-with-document-write – Zach Lysobey Jun 15 '13 at 18:06
apparently `document.write(' – Zach Lysobey Jun 15 '13 at 18:24
@ZachL Yep, I'm using that particular implementation, but I thought it would be too heavy to put it here... You're right with the semicolon, corrected the code : ). I assume I don't need to search a good explanation for this any more? – Teemu Jun 15 '13 at 19:05
yup; I'm good, thanks! A total tangent, but a fun distraction ;-) – Zach Lysobey Jun 15 '13 at 20:00

score 0 · Answer 4 · answered Jun 15 '13 at 18:14

Thought I'd take a stab at writing some code too ;-)

<script>
(function(){
    var script = document.createElement("script"),
        is_ie = (/MSIE/gi.test(navigator.userAgent));
    script.src = (is_ie) ? 'js/ieskins.js' : 'js/moreskins.js';
    document.getElementsByTagName('head')[0].appendChild(script);
}());
</script>

score -1 · Answer 5 · edited Jun 15 '13 at 17:13

-1

Using navigator.userAgent is better and simple. You code doesn't work in any else browser except IE,because only IE understand the mean of <!--[if IE]>

<script type="text/javascript">
    var ie = false;
    if(/MSIE/gi.test(navigator.userAgent)){
       ie = true;
    }
    if(ie == false)
    { 
    document.write ("<script src="js/moreskins.js" type="text/javascript">")</script>;
    } else {
        document.write ("<script src="js/ieskins.js" type="text/javascript">")</script>;

}
</script>

edited Jun 15 '13 at 17:13

Teemu

22,918
7
53
106

answered Jun 15 '13 at 17:11

yoyo

722
6
4

2

Does it make a difference? In that conditional comment OP is changing a predefined variable value to `true` instead of `false`. No other browsers will do that. And you've included all errors from the OP's code too... – Teemu Jun 15 '13 at 17:15
you could shorten that code a bit too: `var ie = (/MSIE/gi.test(navigator.userAgent));` – Zach Lysobey Jun 15 '13 at 18:09
@reyunan Wellcome to Stackoverflow. Looks like you don't want to correct your answer. All erranous answers here are usually downvoted... – Teemu Jun 15 '13 at 19:00

Getting IE to load a different js file

5 Answers5

Linked