Conditional Comments are statements that are conditionally interpreted by Microsoft Internet Explorer in HTML source code. Conditional comments can be used to provide and hide code to Internet Explorer.


Conditional comments first appeared in Microsoft’s Internet Explorer 5 browser and are supported until Internet Explorer 9. Microsoft has announced that Internet Explorer 10 will discontinue support for handling pages in standard mode, such as HTML5, but older versions of Web pages using this technology (in the compatibility view) will continue to work.

Conditional comments are very common when dealing with compatibility problems

<! - the Bootstrap - > < link href = "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel = "stylesheet" > <! HTML5 shim and respond.js are to make IE8 support HTML5 elements and media queries --> <! Warning: Respond. Js does not work when accessing the page via the file:// protocol (that is, drop the HTML page directly to the browser) --> <! -- [if lt IE 9] > < script SRC = "https://cdn.jsdelivr.net/npm/[email protected]/dist/html5shiv.min.js" > < / script > < script SRC = "https://cdn.jsdelivr.net/npm/[email protected]/dest/respond.min.js" > < / script > <! [endif]-->

If it is less than IE9, then if it is less than IE9, then if it is less than IE9, then if it is less than IE9, then if it is less than IE9, then if it is less than IE9, then if it is less than IE9 If it is less than or equal to, it is LTE (less than or equal to), greater than (GT) and greater than or equal to (GTE). The general conditional comment notation is fairly clear, so the focus of this post is not on that, but on how conditional comments are used in browsers other than IE.

I originally wrote this:

<! - [if! IE] > < script type = "text/javascript" SRC = "< % = Page. The ResolveClientUrl (" ~ / Scripts/jquery - 2.1.4. Min. Js") % > "> < / script > <! [endif]--> <! --[if lt IE 9]> <script type="text/javascript" SRC = "< % = Page. ResolveClientUrl (" ~ / Scripts/jquery - 1.12.4. Min. Js") % > "> < / script > <! [endif]-->

Take it for granted! IE can be recognized by other browsers to load different versions of jQuery, but the fact that conditional comments are normally only supported by IE5-IE9 is a unique use of IE, so there is a problem with compatibility. In most cases, this will work fine, but in an environment under IE9, both versions of jQuery will be loaded, and some errors may occur because they do not support the higher version of jQuery. Is there a better solution? Yes, there is. The answer lies in the different ways conditional comments are written, called lower level hide and lower level show.

Downlevel-Hidden

Underlayer hiding is the way we write it above. It’s easy to understand and it’s common, but non-IE browsers will treat it as a normal comment and completely ignore the content.

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

DownLevel – Revealed

To write conditional comments that work in other browsers, you need the underlying notation. Let’s start with a less formal representation of the lower level

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

This example shows content that should only be exposed to non-IE browsers, because this condition is false for IE (and therefore the content is ignored), and the tags themselves are not recognized (and therefore ignored) in non-IE browsers. This is not valid HTML or XHTML. Microsoft acknowledges that this syntax is not standardized markup, and the intent is that the markup will be ignored by other browsers and the content will be exposed.

So how do you write if you want to conform to W3C standards? Here’s the answer:

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

At first glance, there is no difference between the two, but a quick look at the syntax coloring shows the difference. The conditional comment in the lower state is colored to indicate that it has been identified, while the conditional comment in the lower state is hidden to indicate that it has been identified. The reason is that the conditional comment in the lower state is actually commented. We mentioned earlier that browsers outside of IE will ignore all conditional comments as normal comments, so when we comment out the conditional comment, browsers outside of IE will recognize the middle statement, so a reasonable compatibility would be to write it like this:

<! --[if!IE]>--> <script type="text/javascript" SRC ="<%= page.resolveclientURL ("~/Scripts/jquery-2.1.4.min.js") %>"></script> <! - <! [endif]--> <! --[if lt IE 9]> <script type="text/javascript" SRC = "< % = Page. ResolveClientUrl (" ~ / Scripts/jquery - 1.12.4. Min. Js") % > "> < / script > <! [endif]-->

Normal recognition of conditional comments when using IE5-IE9, skip! Ignore conditional comments when using other versions, and read version 2.1.4 jQuery