如何基于js判断浏览器版本


Posted in Javascript onFebruary 20, 2020

这篇文章主要介绍了如何基于js判断浏览器版本,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

浏览器类型判断

不考虑对 IE9 以下浏览器的判断

function getBrowserType(){
  var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  var browser='unknown';
  if (userAgent.indexOf("IE")!=-1) {
    browser="IE";
  }else if(userAgent.indexOf('Firefox')!=-1){
    browser="Firefox";
  }else if(userAgent.indexOf('OPR')!=-1){
    browser="Opera";
  }else if(userAgent.indexOf('Chrome')!=-1){
    browser="Chrome";
  }else if(userAgent.indexOf('Safari')!=-1){
    browser="Safari";
  }else if(userAgent.indexOf('Trident')!=-1){
    browser='IE 11';
  }
  return browser;
}

测试

如何基于js判断浏览器版本

判断IE浏览器的版本

包含edge,ie11,10,9,8,7,6,5,4

// 获取IE版本
function IEVersion() {
  // 取得浏览器的userAgent字符串
  var userAgent = navigator.userAgent;
  // 判断是否为小于IE11的浏览器
  var isLessIE11 = userAgent.indexOf('compatible') > -1 && userAgent.indexOf('MSIE') > -1;
  // 判断是否为IE的Edge浏览器
  var isEdge = userAgent.indexOf('Edge') > -1 && !isLessIE11;
  // 判断是否为IE11浏览器
  var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf('rv:11.0') > -1;
  if (isLessIE11) {
    var IEReg = new RegExp('MSIE (\\d+\\.\\d+);');
    // 正则表达式匹配浏览器的userAgent字符串中MSIE后的数字部分,,这一步不可省略!!!
    IEReg.test(userAgent);
    // 取正则表达式中第一个小括号里匹配到的值
    var IEVersionNum = parseFloat(RegExp['$1']);
    if (IEVersionNum === 7) {
      // IE7
      return 7
    } else if (IEVersionNum === 8) {
      // IE8
      return 8
    } else if (IEVersionNum === 9) {
      // IE9
      return 9
    } else if (IEVersionNum === 10) {
      // IE10
      return 10
    } else {
      // IE版本<7
      return 6
    }
  } else if (isEdge) {
    // edge
    return 'edge'
  } else if (isIE11) {
    // IE11
    return 11
  } else {
    // 不是ie浏览器
    return -1
  }
}

判断浏览器型号及版本号

function getBroswerAndVersion(){
  var os = navigator.platform; 
  var userAgent = navigator.userAgent; 
  var info = ""; 
  var tempArray = ""; 
  //判断浏览器版本
  var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器
  var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器
  var isEdge = userAgent.toLowerCase().indexOf("edge") > -1 && !isIE; //判断是否IE的Edge浏览器
  var isIE11 = (userAgent.toLowerCase().indexOf("trident") > -1 && userAgent.indexOf("rv") > -1); 

  if (/[Ff]irefox(\/\d+\.\d+)/.test(userAgent)) { 
    tempArray = /([Ff]irefox)\/(\d+\.\d+)/.exec(userAgent); 
    info += tempArray[1] + tempArray[2]; 
  } else if (isIE) { 

    var version = ""; 
    var reIE = new RegExp("MSIE (\\d+\\.\\d+);"); 
    reIE.test(userAgent); 
    var fIEVersion = parseFloat(RegExp["$1"]); 
    if (fIEVersion == 7) 
    { version = "IE7"; } 
    else if (fIEVersion == 8) 
    { version = "IE8"; } 
    else if (fIEVersion == 9) 
    { version = "IE9"; } 
    else if (fIEVersion == 10) 
    { version = "IE10"; } 
    else 
    { version = "0" } 

    info += version; 

  } else if (isEdge) { 
    info += "Edge"; 
  } else if (isIE11) { 
    info += "IE11"; 
  } else if (/[Cc]hrome\/\d+/.test(userAgent)) { 
    tempArray = /([Cc]hrome)\/(\d+)/.exec(userAgent); 
    info += tempArray[1] + tempArray[2]; 
  } else if (/[Vv]ersion\/\d+\.\d+\.\d+(\.\d)* *[Ss]afari/.test(userAgent)) { 
    tempArray = /[Vv]ersion\/(\d+\.\d+\.\d+)(\.\d)* *([Ss]afari)/.exec(userAgent); 
    info += tempArray[3] + tempArray[1]; 
  } else if (/[Oo]pera.+[Vv]ersion\/\d+\.\d+/.test(userAgent)) { 
    tempArray = /([Oo]pera).+[Vv]ersion\/(\d+)\.\d+/.exec(userAgent); 
    info += tempArray[1] + tempArray[2]; 
  } else { 
    info += "unknown"; 
  } 
  return info;
}

低于IE9版本提醒

<!--[if lte IE 9]>
<script>
  var bro = getBroswerAndVersion();
  if(bro=="IE5" || bro=="IE6" || bro=="IE7" || bro=="IE8" ){
    alert("浏览器版本过低!请升级至IE9以上");
  }
</script>
<![endif]-->

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

Javascript 相关文章推荐
JavaScript DOM 学习第二章 编辑文本
Feb 19 Javascript
javascript 利用Image对象实现的埋点(某处的点击数)统计
Dec 28 Javascript
javascript实现全角半角检测的方法
Jul 23 Javascript
javascript产生随机数方法汇总
Jan 25 Javascript
JavaScript String 对象常用方法总结
Apr 28 Javascript
BootStrap中Datetimepicker和uploadify插件应用实例小结
May 26 Javascript
jQuery EasyUI提交表单验证
Jul 19 Javascript
微信小程序搜索组件wxSearch实例详解
Jun 08 Javascript
Vue波纹按钮组件制作
Apr 30 Javascript
JS引用传递与值传递的区别与用法分析
Jun 01 Javascript
JS实现简易留言板增删功能
Feb 08 Javascript
jQuery 图片查看器插件 Viewer.js用法简单示例
Apr 04 jQuery
微信小程序webSocket的使用方法
Feb 20 #Javascript
Javascript Worker子线程代码实例
Feb 20 #Javascript
vue中音频wavesurfer.js的使用方法
Feb 20 #Vue.js
Javascript原生ajax请求代码实例
Feb 20 #Javascript
webpack中的模式(mode)使用详解
Feb 20 #Javascript
jquery向后台提交数组的代码分析
Feb 20 #jQuery
koa-passport实现本地验证的方法示例
Feb 20 #Javascript
You might like
PHP输出控制功能在简繁体转换中的应用
2006/10/09 PHP
ThinkPHP视图查询详解
2014/06/30 PHP
PHP与SQL语句写一句话木马总结
2019/10/11 PHP
javascript 写类方式之五
2009/07/05 Javascript
JavaScript 序列化对象实现代码
2009/12/18 Javascript
jquery入门—访问DOM对象方法
2013/01/07 Javascript
关于JS字符串函数String.replace()
2013/04/07 Javascript
javascript函数式编程实例分析
2015/04/25 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
2015/06/24 Javascript
浅谈javascript中return语句
2015/07/15 Javascript
Javascript 引擎工作机制详解
2016/11/30 Javascript
Nodejs进阶:express+session实现简易登录身份认证
2017/04/24 NodeJs
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
在vue项目中使用sass的配置方法
2018/03/20 Javascript
详解webpack打包后如何调试的方法步骤
2018/11/07 Javascript
深入了解JavaScript 防抖和节流
2019/09/12 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
JS实现水平移动与垂直移动动画
2019/12/19 Javascript
如何利用JS将手机号中间四位变成*号
2020/09/29 Javascript
python 安装virtualenv和virtualenvwrapper的方法
2017/01/13 Python
Python基于ThreadingTCPServer创建多线程代理的方法示例
2018/01/11 Python
Tensorflow 自带可视化Tensorboard使用方法(附项目代码)
2018/02/10 Python
Python使用pickle模块报错EOFError Ran out of input的解决方法
2018/08/16 Python
python 循环读取txt文档 并转换成csv的方法
2018/10/26 Python
python实现远程控制电脑
2019/05/23 Python
python lambda表达式在sort函数中的使用详解
2019/08/28 Python
使用python+whoosh实现全文检索
2019/12/09 Python
Python Django中间件使用原理及流程分析
2020/06/13 Python
Python将list元素转存为CSV文件的实现
2020/11/16 Python
英国知名的皮手套品牌:Dents
2016/11/13 全球购物
Toppik顶丰增发纤维官网:解决头发稀疏
2017/12/30 全球购物
酒店保安员岗位职责
2014/01/31 职场文书
离婚协议书应该怎么写
2014/10/12 职场文书
大学生就业意向书
2015/05/11 职场文书
立春观后感
2015/06/18 职场文书
Python爬虫基础之初次使用scrapy爬虫实例
2021/06/26 Python