https://github.com/nioteam/jquery-plugins/issues/12

jQuery在1.9版本之前,提供了一个浏览器对象检测的属性$.browser,使用率极高。但是在1.9版本发布之后,大家钟爱的这个属性被jQuery无情的抛弃了。大家开始着手寻找$.browser的替代方案。于是各种利用IE bug的检测方法被搜了出来:

  1. // shortest from a Russian
  2. var ie = !-[1,]
  3.  
  4. // Option from Dean Edwards:
  5. var ie = /*@cc_on!@*/false
  6.  
  7. // Use the commented line:
  8. var ie//@cc_on=1
  9.  
  10. // Variation (shorter variable):
  11. var ie = '\v'=='v'
  12.  
  13. // Option to Gareth Hayes (former record-holder):
  14. var ie = !+"\v1"

还有一些读取navigator.userAgent的方式,在苹果看来这些写法都不够友好,也不容易记忆,在搜索和挑选之后,终于找到了一个容易理解且友好方便的写法!

解决方案

IE知道自身毛病很多,于是提供的一套官方的HTML hack方式:

  1. <!--[if IE]>
  2. // 全部IE版本可见
  3. <![endif]-->
  4. <!--[if IE 6]>
  5. // IE6可见
  6. <![endif]-->

依次等等。
这样的写法在其它浏览器里,完全就是一坨注释而直接遭到无视,但在IE里却不会。IE会分析里面的提到的版本号,并根据版本号确定要不要解析里面的DOM 元素和文本内容。等一下!DOM元素?那岂不是可以使用js来获取里面的DOM元素?反正谁看到了,谁就是IE!于是,国外大神就有了下面的写法:

  1. var isIE = function(){
  2. var b = document.createElement('b')
  3. b.innerHTML = '<!--[if IE]><i></i><![endif]-->'
  4. return b.getElementsByTagName('i').length === 1
  5. }

这也太巧妙了!首先生成了一个b元素,设置它的innerHTML为一坨只有IE才认识的注释,注释里只有一个空的标签,然后读取里面的出现的元素i的个数是不是等于1,是不是等于1,是不是等于1。。。。
在大苹果看来,这样的写法比其它任何一种都要好。至于为什么生成一个b元素并且里面写一个i元素而不是div或者strong,更多是考虑到前者字节量更小。
检测各个IE版本的方法也就顺理成章了:

  1. var isIE6 = function(){
  2. var b = document.createElement('b')
  3. b.innerHTML = '<!--[if IE 6]><i></i><![endif]-->'
  4. return b.getElementsByTagName('i').length === 1
  5. }
  6. // var isIE7
  7. // ...

更进一步

在苹果看来,还可以进一步将版本号提取成参数,就能生成一个通用的检测IE版本的函数了:

  1. var isIE = function(ver){
  2. var b = document.createElement('b')
  3. b.innerHTML = '<!--[if IE ' + ver + ']><i></i><![endif]-->'
  4. return b.getElementsByTagName('i').length === 1
  5. }
  6. if(isIE(6)){
  7. // IE 6
  8. }
  9. // ...
  10. if(isIE(9)){
  11. // IE 9
  12. }

这样想检测哪个版本都毫无压力。但是,如果只想检测是不是IE,而不关心浏览器版本,那只需要在调用函数的时候,不传递参数即可。

  1. var ie = isIE()

最后依次贴下在各大浏览器里测试代码的截图。

  1. alert('ie6:' + isIE(6) + '\n' + 'ie7:' + isIE(7) + '\n' + 'ie8:' + isIE(8) + '\n' + 'ie9:' + isIE(9) + '\n' + 'ie:' + isIE())



PS:这样性感的写法让其他又要检测userAgent又要匹配版本号的方法黯然失色。

JavaScript判断IE各版本最完美解决方案的更多相关文章

  1. javascript判断浏览器的版本

    在javascript中直接的使用navigator.userAgent就可以获取当前浏览器的版本等信息,以下是列出来的关于不同浏览器显示的值(Windows.Android.iPhone): IE6 ...

  2. 通过JavaScript判断当前浏览器版本

    从别人处拷贝,只用于自己学习之用.参考源自:http://www.cnblogs.com/leadzen/archive/2008/09/06/1285764.html JavaScript是前端开发 ...

  3. JavaScript判断IE各版本完美解决方案

    解决方案 IE知道自身毛病很多,于是提供的一套官方的HTML hack方式: <!--[if IE]> // 全部IE版本可见 <![endif]--> <!--[if ...

  4. javascript判断手机浏览器版本信息

    <script type="text/javascript"> /* * 智能机浏览器版本信息: * */ var browser={ versions:functio ...

  5. JavaScript 判断浏览器及版本

    /* 智能机浏览器版本信息: alert("语言版本: "+browser.language); alert(" 是否为移动终端: "+browser.vers ...

  6. JavaScript判断浏览器及其版本信息

    通过window.navigator来判断: function getBrowserInfo(){ var Info = {}; var str = window.navigator.userAgen ...

  7. JavaScript判断浏览器类型及版本

    JavaScript是前端开发的主要语言,我们可以通过编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来分辨,另一 ...

  8. Safari 前端开发调试 iOS 完美解决方案

    转http://www.2cto.com/kf/201403/283404.html afari 前端开发调试 iOS 完美解决方案 2014-03-05      0个评论    来源:Safari ...

  9. JavaScript判断移动端及pc端访问不同的网站

    JavaScript判断移动端及pc端访问不同的网站 现在很多网站都是分为两个版本,一个pc端的一个移动端的(响应式除外),针对这两个版本,就需要对访问的设备进行判断,如果是pc,就直接访问pc网站, ...

随机推荐

  1. Android 读写SD卡的文件

    今天介绍一下Android 读写SD卡的文件,要读写SD卡上的文件,首先需要判断是否存在SD卡,方法: Environment.getExternalStorageState().equals(Env ...

  2. (三)获取iphone的IMSI

    今天的任务是 iPhone上怎样获取 imsi 信息 来判断所属运营商,资料找了很久!总体有两种方案,但是其中一种好像不行 这里我都记录下来吧: 1: 这是使用coreTelephony.framew ...

  3. C#移动无标题栏窗体的四种代码

    第一种采用,需注意窗体上的控件是否把窗体覆盖了...MouseDown.MouseMove.MouseUp事件应该是鼠标所处位置最顶层的控件的事件在窗体的类中声明两个变量private Point m ...

  4. hdu 2041

    ps:这道题之前一直没思路,有大神提醒我用递推,但当时没搞清...今天做了那个小蜜蜂..才懂得用递推做这道题.. 代码: #include "stdio.h"long long d ...

  5. QT5.4关联VS2010,配置VAssistX关联Qt类

    1.参考网站:http://www.kavenblog.com/?p=272 2.下载插件:http://www.qt.io/zh-hans/download-open-source/#section ...

  6. Bash中的特殊字符

    # 表示注释 #! 指定当前脚本的解析器 #!/bin/bash echo "Hello World" ; 命令分隔符 #!/bin/bash echo hello;echo th ...

  7. DirectX 文本绘制

    在Direct中进行文本绘制,可以通过Win32程序框架实现,也可以通过DXUT进行绘制. 基于第一篇的Win32框架入门实现非常简单,只需要添加数行代码即可.主要说需要修改的地方. #pragma  ...

  8. Inno Setup 插件大全

    Inno Setup 插件大全     这是我收集到的目前网上最全的插件之一,里面的每个插件,都有详细的脚本示例来讲解该插件的具体用法.另外,下载了我公开的脚本的朋友,也有可能会被提示缺少文件,如果缺 ...

  9. Oracle PL/SQL高级应用 游标

    游标可以处理SQL语句查询出来的结果集,进行逐条控制,其实游标在内存中申请空间,将自己指向SQL语句查询出来的结果集,有点像指针的感觉,游标使SQL更加的灵活. DECLARE CURSOR mycu ...

  10. phpcms站---去除域名绑定目录中的HTML

    原网址:http://www.xker.com/page/e2014/1207/148536.html 打开 \install_package 打开 \caches\configs 目录下的 syst ...