web开发就不得不面对浏览器兼容性问题,特别是IE的兼容问题。在前端代码中经常要处理一些兼容格式,为了解决这个问题网上找了找识别浏览器版本的方法。

 

常规js方法

找到一个方法,还不错,可以识别出各种浏览器的版本:

 /**
* 获取浏览器版本
* @returns {Array}
*/
function browserVersion() {
var browserType = "";
var browserVersion = 0;
    var ua = navigator.userAgent.toLocaleLowerCase();
 
    if (ua.match(/msie/) != null) {
        browserType = "IE";
        browserVersion = ua.match(/msie ([\d.]+)/)[1];
    } else if (ua.match(/trident/) != null && ua.match(/rv/) != null) {
        browserType = "Edge";
        browserVersion = ua.match(/rv:([\d.]+)/)[1];
} else if (ua.match(/firefox/) != null) {
        browserType = "Firefox";
browserVersion = (ua.match(/firefox\/([\d.]+)/)[1]).replace(/[^0-9.]/ig,"");
    } else if (ua.match(/opera/) != null) {
        browserType = "Opera";
browserVersion = (ua.match(/opera\/([\d.]+)/)[1]).replace(/[^0-9.]/ig,"");
    } else if (ua.match(/chrome/) != null) {
        browserType = "Chrome";
browserVersion = (ua.match(/chrome\/([\d.]+)/)[1]).replace(/[^0-9.]/ig,"");
    } else if (ua.match(/safari/) != null) {
        browserType = "Safari";
browserVersion = (ua.match(/safari\/([\d.]+)/)[1]).replace(/[^0-9.]/ig,"");
    }
    var arr = new Array(browserType, browserVersion);
    return arr;
}

  

在代码中直接使用也比较简单了。
 

IE的条件注释

在一次偶然的机会看网金社的前端代码,发现一段很特别的注释:
 
这个貌似有点神奇,看代码的意思是一个跳转,但显示是注释的语句,于是抱着试一试的态度将浏览器切换到IE低版本,果然是有效果的。赶紧网上开始找这方面的资料,有一些用法说明,看来确实是可行的方案。
 
条件注释属性:

gt : greater than,选择条件版本以上版本,不包含条件版本

lt : less than,选择条件版本以下版本,不包含条件版本

gte : greater than or equal,选择条件版本以上版本,包含条件版本

lte : less than or equal,选择条件版本以下版本,包含条件版本

! : 选择条件版本以外所有版本,无论高低

用法:

<!--[if IE]>用于 IE <![endif]-->

<!--[if IE 6]>用于 IE6 <![endif]-->

<!--[if IE 7]>用于 IE7 <![endif]-->

<!--[if IE 8]>用于 IE8 <![endif]-->

<!--[if IE 9]>用于 IE9 <![endif]-->

<!--[if gt IE 6]> 用于 IE6 以上版本<![endif]-->

<!--[if lte IE 7]> 用于 IE7或更低版本 <![endif]-->

<!--[if gte IE 8]>用于 IE8 或更高版本 <![endif]-->

<!--[if lt IE 9]>用于 IE9 以下版本<![endif]-->

<!--[if !IE]> -->用于非 IE <!-- <![endif]-->

学习笔记:发现一个IE版本判断的好方法的更多相关文章

  1. 【前端学习笔记01】JavaScript源生判断数据类型的方法

    原始类型(值类型):Undefined.Null.Number.String.Boolean: 对象类型(引用类型):Object: typeof  可以识别标准类型,null外(返回Object): ...

  2. ASP.NET MVC Web API 学习笔记---第一个Web API程序

    http://www.cnblogs.com/qingyuan/archive/2012/10/12/2720824.html GetListAll /api/Contact GetListBySex ...

  3. C#可扩展编程之MEF学习笔记(三):导出类的方法和属性

    前面说完了导入和导出的几种方法,如果大家细心的话会注意到前面我们导出的都是类,那么方法和属性能不能导出呢???答案是肯定的,下面就来说下MEF是如何导出方法和属性的. 还是前面的代码,第二篇中已经提供 ...

  4. blfs(systemv版本)学习笔记-制作一个简单的桌面系统

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 大概思路: lfs(系统)+xorg(驱动)+i3-wm(窗口+桌面)+lightdm(显示管理器+登录管理器) 链接: lfs ...

  5. Asp.Net 学习笔记(IIS不同版本和Asp.Net)

    主要目的是在网上记录一下学习笔记,如有不对,请指出 谢谢!! iis5.x: 存在问题,inet info收到动态请求后,aspnt_isapi.dll会被加载到inetinfo.exe(挂载w3sv ...

  6. 多线程编程学习笔记——编写一个异步的HTTP服务器和客户端

    接上文 多线程编程学习笔记——使用异步IO 二.   编写一个异步的HTTP服务器和客户端 本节展示了如何编写一个简单的异步HTTP服务器. 1.程序代码如下. using System; using ...

  7. Python学习笔记----数据类型 运算符 循环 条件判断

    1. Python安装 在官网www.python.org下载安装程序,可以支持的操作系统linux,windows,mac. Python版本:2.x和3.x,分别有x86和x64. 在Window ...

  8. Android开发学习笔记--给一个按钮定义事件

    学习Android的第一天,了解了各种布局,然后自己动手画出了一个按钮,然后给按钮定义了一个事件是弹出一条消息显示“我成功了!”字样,具体过程如下: 1.修改布局文件activity_main.xml ...

  9. GeneXus学习笔记——创建一个知识库 哈哈哈哈!

    终于想到写什么东西了(绝对不是因为懒 好吧 信我)  那么进入正题 我们写项目的时候 遇到一些问题啥的 总会听到大佬说:“这有什么难的 说到底不就是简单的增删改查么"  然后我们就会露出 Σ ...

随机推荐

  1. TODO:macOS编译PHP7.1

    TODO:macOS编译PHP7.1 本文主要介绍在macOS上编译PHP7.1,有兴趣的朋友可以去尝试一下. 1.下载PHP7.1源码,建议到PHP官网下载纯净到源码包php-7.1.0.tar.g ...

  2. 学习AOP之深入一点Spring Aop

    上一篇<学习AOP之认识一下SpringAOP>中大体的了解了代理.动态代理及SpringAop的知识.因为写的篇幅长了点所以还是再写一篇吧.接下来开始深入一点Spring aop的一些实 ...

  3. hadoop 2.7.3本地环境运行官方wordcount

    hadoop 2.7.3本地环境运行官方wordcount 基本环境: 系统:win7 虚机环境:virtualBox 虚机:centos 7 hadoop版本:2.7.3 本次先以独立模式(本地模式 ...

  4. HTML中上传与读取图片或文件(input file)----在路上(25)

    input file相关知识简例 在此介绍的input file相关知识为: 上传照片及文件,其中包括单次上传.批量上传.删除照片.增加照片.读取图片.对上传的图片或文件的判断,比如限制图片的张数.限 ...

  5. 【开发软件】 在Mac下配置php开发环境:Apache+php+MySql

    本文地址 原文地址   本文提纲: 1. 启动Apache 2. 运行PHP 3. 配置Mysql 4. 使用PHPMyAdmin 5. 附录   有问题请先 看最后的附录   摘要: 系统OS X ...

  6. SOLID 设计原则

    SOLID 原则基本概念: 程序设计领域, SOLID (单一功能.开闭原则.里氏替换.接口隔离以及依赖反转)是由罗伯特·C·马丁在21世纪早期 引入的记忆术首字母缩略字,指代了面向对象编程和面向对象 ...

  7. CRM 数据密钥 忘记 解决方案

    UPDATE EmailServerProfile SET IncomingPassword=nullUPDATE EmailServerProfile SET OutgoingPassword=nu ...

  8. 给缺少Python项目实战经验的人

    我们在学习过程中最容易犯的一个错误就是:看的多动手的少,特别是对于一些项目的开发学习就更少了! 没有一个完整的项目开发过程,是不会对整个开发流程以及理论知识有牢固的认知的,对于怎样将所学的理论知识应用 ...

  9. 跟着老男孩教育学Python开发【第四篇】:模块

    双层装饰器示例 __author__ = 'Golden' #!/usr/bin/env python # -*- coding:utf-8 -*-   USER_INFO = {}   def ch ...

  10. springMvc的日期转换之二

    方式一:使用@InitBinder注解实现日期转换 前台页面: 后台打印: 方式二:处理多种日期格式类型之间的转换 采用方式:由于binder.registerCustomEditor(Date.cl ...