JS如何判断浏览器类型和详细区分IE各版本浏览器


Posted in Javascript onMarch 04, 2017

今天用到JS判断浏览器类型,于是就系统整理了一下,便于后期使用。

/* 
  * 描述:判断浏览器信息 
  * 编写:LittleQiang_w 
  * 日期:2016.1.5 
  * 版本:V1.1 
  */ 
 
 //判断当前浏览类型 
 function BrowserType() 
 { 
   var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 
   var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器 
   var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器 
   var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判断是否IE的Edge浏览器 
   var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器 
   var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1; //判断是否Safari浏览器 
   var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1; //判断Chrome浏览器 
 
   if (isIE)  
   { 
      var reIE = new RegExp("MSIE (\\d+\\.\\d+);"); 
      reIE.test(userAgent); 
      var fIEVersion = parseFloat(RegExp["$1"]); 
      if(fIEVersion == 7) 
      { return "IE7";} 
      else if(fIEVersion == 8) 
      { return "IE8";} 
      else if(fIEVersion == 9) 
      { return "IE9";} 
      else if(fIEVersion == 10) 
      { return "IE10";} 
      else if(fIEVersion == 11) 
      { return "IE11";} 
      else 
      { return "0"}//IE版本过低 
    }//isIE end 
     
    if (isFF) { return "FF";} 
    if (isOpera) { return "Opera";} 
    if (isSafari) { return "Safari";} 
    if (isChrome) { return "Chrome";} 
    if (isEdge) { return "Edge";} 
  }//myBrowser() end 
   
  //判断是否是IE浏览器 
  function isIE() 
  { 
   var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 
   var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器 
   if(isIE) 
   { 
     return "1"; 
   } 
   else 
   { 
     return "-1"; 
   } 
  } 
   
   
  //判断是否是IE浏览器,包括Edge浏览器 
  function IEVersion() 
  { 
   var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 
   var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器 
var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判断是否IE的Edge浏览器 
   if(isIE) 
   { 
      var reIE = new RegExp("MSIE (\\d+\\.\\d+);"); 
      reIE.test(userAgent); 
      var fIEVersion = parseFloat(RegExp["$1"]); 
      if(fIEVersion == 7) 
      { return "IE7";} 
      else if(fIEVersion == 8) 
      { return "IE8";} 
      else if(fIEVersion == 9) 
      { return "IE9";} 
      else if(fIEVersion == 10) 
      { return "IE10";} 
      else if(fIEVersion == 11) 
      { return "IE11";} 
      else 
      { return "0"}//IE版本过低 
   } 
else if(isEdge) 
{ 
  return "Edge"; 
} 
   else 
   { 
     return "-1";//非IE 
   } 
  }

以上代码通过测试,可用!

但存在一个问题,即IE5与IE7浏览器暂不能区分,以下是IE5与IE7下userAgent的信息;通过userAgent发现,简单的通过以上方法,无法正确区分IE5和IE7。期待该问题的解决方案!!!

IE5: userAgent   "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; .NET4.0E)"

IE7: userAgent  "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; .NET4.0E)"

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
HTA版JSMin(省略修饰语若干)基于javascript语言编写
Dec 24 Javascript
JavaScript中的prototype.bind()方法介绍
Apr 04 Javascript
JQuery右键菜单插件ContextMenu使用指南
Dec 19 Javascript
JavaScript中的逻辑判断符&&、||与!介绍
Dec 31 Javascript
js对字符的验证方法汇总
Feb 04 Javascript
jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
Jan 19 Javascript
高效利用Angular中内置服务$http、$location等
Mar 22 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
Jun 21 Javascript
不刷新网页就能链接新的js文件方法总结
Mar 01 Javascript
序列化模块json代码实例详解
Mar 03 Javascript
vue实现从外部修改组件内部的变量的值
Jul 30 Javascript
vue+springboot实现登录验证码
May 27 Vue.js
详解在Vue中通过自定义指令获取dom元素
Mar 04 #Javascript
在javaScript中检测数据类型的几种方式小结
Mar 04 #Javascript
jQuery插件echarts实现的去掉X轴、Y轴和网格线效果示例【附demo源码下载】
Mar 04 #Javascript
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
Mar 04 #Javascript
php输出全部gb2312编码内的汉字方法
Mar 04 #Javascript
jQuery插件echarts实现的多柱子柱状图效果示例【附demo源码下载】
Mar 04 #Javascript
jQuery插件Echarts实现的双轴图效果示例【附demo源码下载】
Mar 04 #Javascript
You might like
可以在线执行PHP代码包装修正版
2008/03/15 PHP
PHP设计模式 注册表模式
2012/02/05 PHP
使用session判断用户登录用户权限(超简单)
2013/06/08 PHP
关于ob_get_contents(),ob_end_clean(),ob_start(),的具体用法详解
2013/06/24 PHP
微信API接口大全
2015/04/15 PHP
PHP实现长文章分页实例代码(附源码)
2016/02/03 PHP
解决form中action属性后面?传递参数 获取不到的问题
2017/07/21 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
ThinkPHP框架实现的MySQL数据库备份功能示例
2018/05/24 PHP
Jquery图形报表插件 jqplot简介及参数详解
2012/10/10 Javascript
javascript包装对象实例分析
2015/03/27 Javascript
关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别
2015/10/12 Javascript
js实现下拉菜单效果
2017/03/01 Javascript
理解 Node.js 事件驱动机制的原理
2017/08/16 Javascript
Vue-cli3简单使用(图文步骤)
2019/04/30 Javascript
django简单的前后端分离的数据传输实例 axios
2020/05/18 Javascript
vue下拉刷新组件的开发及slot的使用详解
2020/12/23 Vue.js
python实现诗歌游戏(类继承)
2019/02/26 Python
python实现接口并发测试脚本
2019/06/25 Python
Python整数与Numpy数据溢出问题解决
2019/09/11 Python
如何在pycharm中安装第三方包
2020/10/27 Python
HTML5边玩边学(3)像素和颜色
2010/09/21 HTML / CSS
HTML5移动端手机网站开发流程
2016/04/25 HTML / CSS
京东全球售:直邮香港,澳门,台湾,美国,澳大利亚等地区
2017/09/24 全球购物
Draper James官网:知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
什么是Smarty变量操作符?如何使用Smarty变量操作符
2014/07/18 面试题
int *p=NULL和*p= NULL有什么区别
2014/10/23 面试题
客服服务心得体会
2013/12/30 职场文书
2014自荐信的写作技巧
2014/01/28 职场文书
农贸市场管理制度
2014/01/31 职场文书
大学辅导员事迹材料
2014/02/05 职场文书
干部鉴定材料
2014/05/18 职场文书
安全施工标语
2014/06/07 职场文书
小型婚礼主持词
2015/06/30 职场文书
56句经典英文座右铭
2019/08/09 职场文书
聊聊Python String型列表求最值的问题
2022/01/18 Python