3

I'd like to know if it's possible to write conditional javascript within a javascript file for Internet Explorer.

i.e. something like this...

if (is IE7) {
    do this } else {
    do this instead
});

I know I can load a completely different script for IE using conditional comments in the head, but I only want to change a small piece of code and so loading a completely different sheet would be an 'expensive' way to do that.

kapa
  • 77,694
  • 21
  • 158
  • 175
SparrwHawk
  • 13,581
  • 22
  • 61
  • 91

7 Answers7

4

When writing Javascript, doing feature detection is always the way to go instead of browser detection. So instead of doing if (IE7) do if (feature).

For example, if you want to know if your browser supports getElementsByClassName(), instead of checking the browser version, you check for the existence of the function ( if (document.getElementsByClassName) ).

Please read this great article:

Object detection on Quirksmode

If you want to know whether the browser that views your page supports certain objects you want to use in your code, you should never EVER use a browser detect. Sure, you know that this–and–that browser will support your code while such–and–so browser won’t. But how about other browsers, obscure browsers?

kapa
  • 77,694
  • 21
  • 158
  • 175
  • Thanks, I agree with you, but feature detection is not the way to go when I am just trying to cater for IE7 bugs. – SparrwHawk Jun 27 '11 at 18:54
  • @Sparrohawx Most of the time it is the way. But as we have no examples, I cannot prove this. – kapa Jun 27 '11 at 18:59
2

Not within the JavaScript file directly.

A few alternatives would be:

Using a global variable before the script is loaded to check in your JavaScript file. This is a bit of a hybrid approach and could get messy, but it's guaranteed IE detection.

<!--[if IE]>
<script type="text/javascript">
  var is_ie = true;
</script>
<![endif]-->
<script type="text/javascript" src="somefile.js"></script>

Or, a more traditional approach using browser or object detection within the JavaScript file.

Jason McCreary
  • 71,546
  • 23
  • 135
  • 174
  • +1 It looks messy, but if you really want browser detection (which is only right in certain edge cases), this seems to be the best way. – kapa Jun 27 '11 at 18:58
  • 1
    This is a far more stable solution. Sadly, conditional comments get passed over time and again for fallacious UA sniffing. –  Jun 27 '11 at 19:59
  • 1
    +1 This is my preferred method as well, though it still feels a bit dirty ;-) – Ryan Kinal Jun 28 '11 at 14:08
  • This is a good solution but the question says within a JavaScript file – Nathan Romano Jul 12 '11 at 19:50
  • 1
    @Nathan, yes and my answer clearly states *Not within the JavaScript file directly*. Thanks for the two week delayed downvote though. – Jason McCreary Jul 12 '11 at 20:30
2

Conditional compilation is exactly what you are looking for.

<script>
/*@cc_on

  @if (@_jscript_version == 5.7 && window.XMLHttpRequest)
    document.write("You are using IE7");

  @end

@*/
</script>
Knu
  • 14,806
  • 5
  • 56
  • 89
1

Despite the fact that this is an answer to the original question, this is NOT what you should do. So don't do it!

Why not work out which browser you are using and store that in a variable in javascript. Then you can have if statemenets and the like in your javascript. e.g. If I am IE then do this, otherwise do that. You get the idea!

Have you seen this? Browser sniffing

The salient bit:

var is = {
  ff: window.globalStorage,
  ie: document.all && !window.opera,
  ie6: !window.XMLHttpRequest,
  ie7: document.all && window.XMLHttpRequest && !XDomainRequest && !window.opera,
  ie8: document.documentMode==8,
  opera: Boolean(window.opera),
  chrome: Boolean(window.chrome),
  safari: window.getComputedStyle && !window.globalStorage && !window.opera
}
Community
  • 1
  • 1
Tom Chantler
  • 14,753
  • 4
  • 48
  • 53
  • 1
    -1 for showing how to use feature detection the *wrong* way. There is no guarantee that the existence or non existence of certain features means a particular browser. Browsers change all the time, implementing new features and (rarely) deprecating old ones. – Ryan Kinal Jun 27 '11 at 19:55
  • Ouch! Isn't that how jQuery does it behind the scenes? And isn't that pretty much what everybody else's answer has said? Did you -1 everybody else? Seriously though, if this answer is wrong, what is the correct answer to this question? And as an aside, how can the features of IE6, IE7 or IE8 change, when they have all been superseded? – Tom Chantler Jun 27 '11 at 20:03
  • 1
    That isn't, actually, what other answers have said. Other answers have used actual user agent sniffing, conditional comments, or feature detection. This uses features of the browser to come to conclusions about which browser it is. Firefox may mean the existence of `window.globalStorage` but the existence of `window.globalStorage` does not necessarily mean Firefox. – Ryan Kinal Jun 28 '11 at 12:29
  • Oh okay, fair enough. There are A LOT of resources that suggest that it's okay to do exactly that, but I can't fault your logic. Hopefully yours and my comments will serve as a warning to anybody else who may have been tempted to use this method which I found elsewhere on StackOverflow. – Tom Chantler Jun 28 '11 at 12:43
1

My go-to script for this is PPK's BrowserDetect script. It's lightweight, easily understandable, and doesn't require you to use a library. When it's loaded, you can write code like:

if (BrowserDetect.browser == "Explorer" && BrowserDetect.version >= 6 && BrowserDetect.version <= 8) {
    // IE6-8 code
{

Of course, you should avoid using this at all (reasonable) costs, but there's times where it's cleaner to quarantine IE-specific code away rather than try to hack around IE-specific functions and bugs.

user805804
  • 191
  • 3
0

If you are using jquery you code do this

if ($.browser.msie && $.browser.version == '6.0') {
     //do IE specific code
}
Nathan Romano
  • 7,016
  • 3
  • 19
  • 18
  • This is great, exactly what I needed. For anyone else needing advice here is a reference list for targeting specific browsers http://blog.bestwebframeworks.com/detect-browsers-with-jquery/ – SparrwHawk Jun 27 '11 at 18:54
  • 2
    This feature is removed from jQuery, starting at version 1.9. – kapa Jul 05 '13 at 10:15
-1

If you want to use jquery, it has a built in browser detect.

http://api.jquery.com/jQuery.browser/

Yogurt The Wise
  • 4,379
  • 4
  • 34
  • 42