利用条件注释判断IE浏览器

条件注释

众所周知ie浏览器兼容一直都是我们前端人员都痛,但是几乎所以浏览器都支持针对ie都条件注释来判断ie版本,从而达到根据需求加载相应的资源:

<!--[if !IE]> 除IE外都可识别<![endif]-->
<!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
<!--[if IE 8]> 仅IE8可识别 <![endif]-->
<!--[if IE 9]> 仅IE9可识别 <![endif]-->

添加注释各个符号释义

符号 范例 说明
! [if !IE] NOT运算符。这是摆立即在前面的功能,操作员,或子表达式扭转布尔表达式的意义。
lt [if lt IE 5.5] 小于运算符。如果第一个参数小于第二个参数,则返回true。
lte [if lte IE 6] 小于或等于运算。如果第一个参数是小于或等于第二个参数,则返回true。
gt [if gt IE 5] 大于运算符。如果第一个参数大于第二个参数,则返回true。
gte [if gte IE 7] 大于或等于运算。如果第一个参数是大于或等于第二个参数,则返回true。
( ) [if !(IE 7)] 子表达式。在与布尔运算符用于创建更复杂的表达式。
& [if (gt IE 5)&(lt IE 7)] AND运算符。如果所有的子表达式计算结果为true,返回true
| [if (IE 6)|(IE 7)] OR运算符。返回true,如果子表达式计算结果为true。

条件注释范例

  • 例如简书的注释,可以根据ie版本不同加载不同类
<!--[if IE 6]><html class="ie lt-ie8"><![endif]-->
<!--[if IE 7]><html class="ie lt-ie8"><![endif]-->
<!--[if IE 8]><html class="ie ie8"><![endif]-->
<!--[if IE 9]><html class="ie ie9"><![endif]-->
<!--[if !IE]><!--> <html> <!--<![endif]-->
  • 也可以引入资源
    <!--[if IE 8]>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js" ></script> 
     <![endif]-->
  • 可以直接插入代码
<!--[if IE]><p>You are using Internet Explorer.</p><![endif]-->
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容