IE的有条件注释判定IE版本详解(附实例代码)_javascript技巧

IE的有条件注释是一种专有的(因此是非标准的)、对常规(X)HTML注释的Miscrosoft扩展。顾名思义,有条件注释使你能够根据条件(比如浏览器版本)显示代码块。尽管是非标准的,但是有条件注释对于其他所有浏览器作为常规注释出现,因此本质上是无害的。有条件注释在Windows上的IE5中首次出现,并且得到了Widnows浏览器所有后续版本的支持。

IE的有条件注释及其有效,而且非常容易记住。主要的缺点是这些注释需要放在HTML页面中,而不是放在CSS中。这样,当你不需要这些东西,或者有所更改的时候,就需要维护很多的地方。

让我们据几个例子来看看吧——

只有IE才能识别
因为只有IE5以上的版本才开始支持IE条件注释,所有“只有IE”才能识别的意思是“只有IE5版本以上”才能识别。

复制代码 代码如下:

<!--[if IE]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

只有特定版本才能识别
例如,只有IE5才能识别,只有IE6才能识别,只有IE7或者IE8才能识别。识别的条件是特定的版本,高了或者低了都不可以。例如下面的代码块,将只会在IE8中有效

复制代码 代码如下:

<!--[if IE 8]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
只有不是特定版本的才能识别
当然,IE浏览器需要在5以上的版本,才在讨论范围之内。例如下面的例子中,特定了IE7版本不能识别。

复制代码 代码如下:

<!--[if !IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
只有高于特定版本才能识别
只有高于制定版本的IE浏览器才能识别的代码块。

复制代码 代码如下:

<!--[if gt IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
有朋友会问,为什么IE7没有应用到效果呢?那是因为IE7等于IE7,而不是高于IE7。所有IE7也没有起效果。

等于或者高于特定版本才能识别

复制代码 代码如下:

<!--[if gte IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
只有低于特定版本的才能识别

复制代码 代码如下:

<!--[if lt IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
等于或者低于特定版本的才能识别

复制代码 代码如下:

<!--[if lte IE 7]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->


关键词解释
上面那些代码好像很难记的样子,其实只要稍微解释一下关键字就很容易记住了。
lt :就是Less than的简写,也就是小于的意思。
lte :就是Less than or equal to的简写,也就是小于或等于的意思。
gt :就是Greater than的简写,也就是大于的意思。
gte:就是Greater than or equal to的简写,也就是大于或等于的意思。
!:就是不等于的意思,跟javascript里的不等于判断符相同。
这样解释一下,是不是好记多了。
关于IE条件注释的特别说明
只有IE才能识别哦——
曾经看到过下面的代码,现在想起来不禁有点想笑。这样的代码有什么意义吗?

复制代码 代码如下:

<!--[if !IE]>
<style type="text/css">
@import "test.css";
</style>
<![endif]-->

 
不仅仅是CSS哦
很长时间,我对这个都有一种误解——以为它就是用来根据浏览器不同载入不同css,从而解决样式兼容性问题的。其实,我错了。它其实可以做的更多。它可以保护任何代码块——HTML代码块、JavaScript代码块、服务器端代码……看看下面的代码。

复制代码 代码如下:

<!--[if IE]>
你使用的是IE浏览器,还会弹出个框哦。
<script type="text/javascript"> alert("你使用的是IE浏览器!");</script>
<![endif]-->

时间: 2024-10-31 20:06:24

IE的有条件注释判定IE版本详解(附实例代码)_javascript技巧的相关文章

js判断浏览器类型,版本的代码(附多个实例代码)_javascript技巧

在网站前端开发中,浏览器兼容性问题本已让我们手忙脚乱,Chrome的出世不知道又要给我们添多少乱子.浏览器兼容性是前端开发框架要解决的第一个问题,要解决兼容性问题就得首先准确判断出浏览器的类型及其版本. JavaScript是前端开发的主要语言,我们可以通过编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来分辨,另一种是通过分析浏览器的userAgent属性来判断的.在许多情况下,值判断出浏览器类型之后,还需判

通过判断JavaScript的版本实现执行不同的代码_javascript技巧

复制代码 代码如下: <html> <head> <title>JavaScript版本测试</title> </head> <body> <script language="JavaScript"> //仅支持JavaScript 1.0的浏览器才读该部分 document.write('浏览器支持JavaScript 1.0<br>'); </script> <scri

判定对象是否为window的js代码_javascript技巧

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 结果是五花八门: [object Object]IE6 [object Object]IE8 [object Window]firefox3.6 [object Window]opera10 [object DOMWindow]safai4.04 [object global]chrome5.0.3.22 看一下赫赫有名怎样判定,就判定它是否存在一个叫setInterval的属性.啧啧,好像不太严谨,但也无法严谨下去了,因为在IE中无法

Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码_javascript技巧

/** * @author hechen */ var gs = { /**获得屏幕宽度**/ ScreenWidth: function () { return window.screen.width; }, /***获得屏幕高度**/ ScreenHeight: function () { return window.screen.height; }, /**获得浏览器***/ Browse: function () { var browser = {}; var userAgent = n

针对IE6、7、8条件注释语句(不同版本IE显示用不用css)

一.条件注释简介 1.IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法. 2.条件注释只能用于IE5以上. 3.如果你安装了多个IE,条件注释将会以最高版本的IE为标准. 4.条件注释的基本结构和HTML的注释(<!– –>)是一样的.因此IE以外的浏览器将会把它们看作是普通的注释而完全忽略它们. 5.IE将会根据if条件来判断是否如解析普通的页面内容一样解析条件注释里的内容. 二.条件注释属性 gt : g

IE 条件注释详解总结(附实例代码)_javascript技巧

顾名思义,有条件注释使你能够根据条件(比如浏览器版本)显示代码块.尽管是非标准的,但是有条件注释对于其他所有浏览器作为常规注释出现,因此本质上是无害的.有条件注释在Windows上的IE5中首次出现,并且得到了Widnows浏览器所有后续版本的支持. IE的有条件注释及其有效,而且非常容易记住.主要的缺点是这些注释需要放在HTML页面中,而不是放在CSS中.这样,当你不需要这些东西,或者有所更改的时候,就需要维护很多的地方. 让我们据几个例子来看看吧-- 只有IE才能识别 因为只有IE5以上的版

Android使用ViewDragHelper实现QQ6.X最新版本侧滑界面效果实例代码_Android

(一).前言: 这两天QQ进行了重大更新(6.X)尤其在UI风格上面由之前的蓝色换成了白色居多了,侧滑效果也发生了一些变化,那我们今天来模仿实现一个QQ6.X版本的侧滑界面效果.今天我们还是采用神器ViewDragHelper来实现. 本次实例具体代码已经上传到下面的项目中,欢迎各位去star和fork一下. https://github.com/jiangqqlmj/DragHelper4QQ FastDev4Android框架项目地址:https://github.com/jiangqqlm

三足鼎立!威博 “全网营销”电子商务外包服务三大版本详解

"让企业在最短的时间内迅速拥有由专业设计师精心打造的淘宝.有啊.拍拍网店以及独立网上商城系统,并由威博全网营销推广部通过可选择性的多种方式迅速推广至互联网每一个角落,它将网店建设.网店管理.网店推广和产品代销等一系列电子商务外包服务集成一体,帮助企业将产品迅速覆盖全网.抢占市场份额!"上海威博总裁成新东向记者表示:"我们高调的对外宣布,威博隆重推出"全网营销"服务计划,在即将到来的2011年进一步帮助更多企业全面进军电子商务.未来三年内,电子商务市场将进一

百度语音识别(Baidu Voice) Android studio版本详解_Android

百度语音识别(Baidu Voice) Android studio版本       已同步更新至个人blog:http://dxjia.cn/2016/02/29/baidu-voice-helper/       最近在一个练手小项目里要用到语音识别,搜索了一下,比较容易集成的就算Baidu voice跟讯飞语音了,baidu提供了直接可以使用的显示控件,而讯飞需要自己实现,另外baidu提供每天5W次的调用频率,对于我来说足够使用啦.所以就选择使用Baidu Voice(控件会有baidu