如何基于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 相关文章推荐
jQuery 全选效果实现代码
Mar 23 Javascript
jquery中动态效果小结
Dec 16 Javascript
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
jQuery获取父元素及父节点的方法小结
Apr 14 Javascript
JS之获取样式的简单实现方法(推荐)
Sep 13 Javascript
浅谈JavaScript的计时器对象
Dec 26 Javascript
详解前端构建工具gulpjs的使用介绍及技巧
Jan 19 Javascript
js实现多行文本框统计剩余字数功能
Mar 28 Javascript
ReactNative中使用Redux架构总结
Dec 15 Javascript
详解Node.js中的Async和Await函数
Feb 22 Javascript
JS使用canvas中的measureText方法测量字体宽度示例
Feb 02 Javascript
微信小程序之侧边栏滑动实现过程解析(附完整源码)
Aug 23 Javascript
微信小程序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 获取客户端的真实ip
2009/11/30 PHP
php使用mkdir创建多级目录入门例子
2014/05/10 PHP
php无限分类使用concat如何实现
2015/11/05 PHP
使用Zookeeper分布式部署PHP应用程序
2019/03/15 PHP
PHP Swoole异步Redis客户端实现方法示例
2019/10/24 PHP
深入理解JQuery keyUp和keyDown的区别
2013/12/12 Javascript
javaScript年份下拉列表框内容为当前年份及前后50年
2014/05/28 Javascript
javascript中for/in循环及使用技巧
2015/09/01 Javascript
详解JavaScript基本类型和引用类型
2015/12/09 Javascript
javascript的几种继承方法介绍
2016/03/22 Javascript
Vue 短信验证码组件开发详解
2017/02/14 Javascript
原生js更改css样式的两种方式
2017/03/15 Javascript
JavaScript数据结构中栈的应用之表达式求值问题详解
2017/04/11 Javascript
JavaScript文件的同步和异步加载的实现代码
2017/08/19 Javascript
微信小程序实现同一页面取值的方法分析
2019/04/30 Javascript
layui下拉框获取下拉值(select)的例子
2019/09/10 Javascript
js实现图片实时时钟
2020/01/15 Javascript
Linux下使用python自动修改本机网关代码分享
2015/05/21 Python
实例解析Python的Twisted框架中Deferred对象的用法
2016/05/25 Python
python3读取MySQL-Front的MYSQL密码
2017/05/03 Python
Python实现通讯录功能
2018/02/22 Python
从列表或字典创建Pandas的DataFrame对象的方法
2019/07/06 Python
Python 实现向word(docx)中输出
2020/02/13 Python
Python发送手机动态验证码代码实例
2020/02/28 Python
解决Python spyder显示不全df列和行的问题
2020/04/20 Python
python实现粒子群算法
2020/10/15 Python
详解Python利用configparser对配置文件进行读写操作
2020/11/03 Python
详解使用scrapy进行模拟登陆三种方式
2021/02/21 Python
印度首个本地在线平台:nearbuy
2019/03/28 全球购物
入党积极分子自我鉴定
2014/02/18 职场文书
初中新生军训方案
2014/05/13 职场文书
行政助理岗位职责
2015/02/10 职场文书
小学少先队工作总结2015
2015/05/26 职场文书
党员转正大会主持词
2015/07/02 职场文书
Vue接口封装的完整步骤记录
2021/05/14 Vue.js
端午节将至,用Python爬取粽子数据并可视化,看看网友喜欢哪种粽子吧!
2021/06/11 Python