如何基于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的访问WebService的代码(可访问Java[Xfire])
Nov 19 Javascript
对于this和$(this)的个人理解
Sep 08 Javascript
详细介绍8款超实用JavaScript框架
Oct 25 Javascript
基于Css3和JQuery实现打字机效果
Aug 11 Javascript
基于javascript实现listbox左右移动
Jan 29 Javascript
JS中传递参数的几种不同方法比较
Jan 20 Javascript
基于JQuery及AJAX实现名人名言随机生成器
Feb 10 Javascript
vue.js 初体验之Chrome 插件开发实录
May 13 Javascript
vue.js 图片上传并预览及图片更换功能的实现代码
Aug 27 Javascript
Node.js之readline模块的使用详解
Mar 25 Javascript
详解key在Vue列表渲染时究竟起到了什么作用
Apr 20 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 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新手上路(九)
2006/10/09 PHP
php 归并排序 数组交集
2011/05/10 PHP
[原创]php获取数组中键值最大数组项的索引值
2015/03/17 PHP
php使用Imagick生成图片的方法
2015/07/31 PHP
PHP实现的数组和XML文件相互转换功能示例
2018/03/15 PHP
php自定义排序uasort函数示例【二维数组按指定键值排序】
2019/06/19 PHP
判断输入是否为空,获得输入类型的JS代码
2013/10/30 Javascript
导入extjs、jquery 文件时$使用冲突问题解决方法
2014/01/14 Javascript
Node.js实现批量去除BOM文件头
2014/12/20 Javascript
javascript实现行拖动的方法
2015/05/27 Javascript
JavaScript中的Number数字类型学习笔记
2016/05/26 Javascript
JS去除重复并统计数量的实现方法
2016/12/15 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
2017/02/06 Javascript
Vue如何实现组件的源码解析
2017/06/08 Javascript
详解动画插件wow.js的使用方法
2017/09/13 Javascript
cordova入门基础教程及使用中遇到的一些问题总结
2017/11/14 Javascript
微信小程序实现打卡签到页面
2020/09/21 Javascript
基于vue-simple-uploader封装文件分片上传、秒传及断点续传的全局上传插件功能
2021/02/23 Vue.js
[05:35]DOTA2英雄梦之声_第13期_拉比克
2014/06/21 DOTA
[02:04]2014DOTA2国际邀请赛 DK一个时代的落幕
2014/07/21 DOTA
[51:17]Mineski vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.22
2019/09/05 DOTA
Python通过poll实现异步IO的方法
2015/06/04 Python
Python使用中文正则表达式匹配指定中文字符串的方法示例
2017/01/20 Python
python使用Turtle库绘制动态钟表
2018/11/19 Python
Python和Go语言的区别总结
2019/02/20 Python
Python操作redis实例小结【String、Hash、List、Set等】
2019/05/16 Python
pytorch:实现简单的GAN示例(MNIST数据集)
2020/01/10 Python
机修工岗位职责
2013/11/24 职场文书
2014全国两会学习心得体会1000字
2014/03/10 职场文书
小学三八妇女节活动方案
2014/03/16 职场文书
检察院对照“四风”认真查找问题落实整改措施
2014/09/26 职场文书
文明班级申报材料
2014/12/24 职场文书
冰峪沟导游词
2015/02/09 职场文书
八年级作文之感恩
2019/11/22 职场文书
Golang标准库syscall详解(什么是系统调用)
2021/05/25 Golang
Java中生成微信小程序太阳码的实现方案
2022/06/01 Java/Android