Downlevel-hidden conditional comment

Below are two examples of a "downlevel hidden" conditional comment:

<!--[if IE 8]>
<link href="ie8only.css" rel="stylesheet">
<![endif]-->

or

<!--[if lte IE 7]>
<style type="text/css">
/* CSS here */
</style>
<![endif]-->

The directive in the first example will let IE 8 read the specified CSS file, while IE 7 or older IE versions will ignore it. Browsers other than IE will also ignore it because it looks like a standard HTML comment. The tag in the second example will let IE versions 5.0 through 7 read the internal CSS style. With different uses of this tag you can also single out IE 6, IE 5, or versions of IE that are newer (greater) or older (less) than a specified version.

Downlevel-revealed conditional comment

Below is an example of a "downlevel revealed" conditional 'comment', which is not an (X)HTML comment at all, despite the misleading name, using the default Microsoft syntax:

<![if !IE]>
<link href="non-ie.css" rel="stylesheet">
<![endif]>

This example shows content that should be exposed only to non-IE browsers, as the condition evaluates to "false" on IE (and hence the content is ignored), while the tags themselves are unrecognized (and hence ignored) on non-IE browsers. This is not valid HTML or XHTML.

Microsoft acknowledges this syntax is not standardized markup,^[4] intending these tags to be overlooked by other browsers and expose the content in the middle. In order to ensure compliance with W3C standards, some web developers use an alternative technique^[5] for downlevel-revealed conditional comments:

<!--[if !IE]>-->
<link href="non-ie.css" rel="stylesheet">
<!--<![endif]-->

While somewhat confusing in structure, this specific syntax is valid (X)HTML and is useful for conditional sections intended specifically for non-IE browsers; if the condition evaluates to true (for example, if writing code meant to display on non-IE browsers and on some versions of IE), IE will then display the --> present before the HTML content. This problem is easily solved by prepending <! to the initial --> as follows:

<!--[if gt IE 6]><!-->
This code displays on non-IE browsers and on IE 7 or higher.
<!--<![endif]-->

The extra <! is ignored by non-IE browsers, and it is also ignored by IE regardless of the condition: if false, everything within the conditional comment is ignored, and if true, the resulting tag <!--> is unrecognized and therefore ignored.

Conditional comments in JScript

Starting with Internet Explorer 4, there exists a similar proprietary mechanism for adding conditional comments within JScript, known as conditional compilation.^[6]

Code examples:

<script>
/*@cc_on
  document.write("You are using IE4 or higher");
@*/
</script>

There were also several predefined variables,^[7] though these cannot be relied on any longer as Microsoft altered the JScript engine of IE6 with XP SP3 and it now reports as @_jscript_version == 5.7. As a result, a possible way to detect Internet Explorer version using conditional compilation can be seen below:

<script>
/*@cc_on

  @if (@_jscript_version == 11)
    document.write("You are using IE11 with an older document mode");
  @elif (@_jscript_version == 10)
    document.write("You are using IE10");
  @elif (@_jscript_version == 9)
    document.write("You are using IE9");
  @elif (@_jscript_version == 5.8)
    document.write("You are using IE8");
  @elif (@_jscript_version == 5.7)
    document.write("You are using IE" + (!window.XMLHttpRequest ? 6 : 7));
  @elif (@_jscript_version == 5.6)
    document.write("You are using IE6");
  @elif (@_jscript_version == 5.5)
    document.write("You are using IE5.5");
  @elif (@_jscript_version < 5.5)
    document.write("You are using a version older than IE5.5");
  @else
    document.write("You are using an unknown version of IE");
  @end
 
@*/
</script>

However, conditional compilation is no longer supported in Internet Explorer 11 Standards mode.^[8]