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]-->

最新文章

  1. bzoj3648: 寝室管理(环套树+点分治)
  2. 成为JavaGC专家(1)—深入浅出Java垃圾回收机制
  3. eclipse 切换svn账号
  4. 1st-code-review summary
  5. Android ListVIew 详解(一)
  6. mac下git中文乱码
  7. 【转】HTML中A标签与click事件的前世今生
  8. javaWeb实现使用邮箱邮件找回密码功能
  9. Touch事件
  10. Mysql学习(慕课学习笔记5)约束
  11. spark论坛
  12. Software development process
  13. grep使用技巧一:模式pattern为字符串文件
  14. 阿里云 API调用实践(python语言)
  15. windows下ping端口
  16. VUE 脚手架项目搭建
  17. java泛型中&lt;?&gt;和&lt;T&gt;区别
  18. 20155308 2016-2017-2 《Java程序设计》第9周学习总结
  19. 阿里云 centos7 tomcat 启动巨慢的解决方法(几分钟)
  20. Atitit. 解释器模式框架选型 and应用场景attilax总结 oao

热门文章

  1. 记一次SQLServer的分页优化兼谈谈使用Row_Number()分页存在的问题
  2. 【java】Naming.bind和Registry.bind区别
  3. 03.LoT.UI 前后台通用框架分解系列之——多样的表格
  4. 12、Struts2表单重复提交
  5. golang struct扩展函数参数命名警告
  6. VICA 架构设计(1)
  7. C#项目中文件的具体含义
  8. Java虚拟机 JVM
  9. Ubuntu安装redis并配置远程、密码以及开启php扩展
  10. photoshop:无法完成请求 因为暂存盘已满