javascript实现获取浏览器版本、浏览器类型


Posted in Javascript onDecember 02, 2015

     从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下:

<script type="text/javascript">
    var Sys = {};
    var ua = navigator.userAgent.toLowerCase();
    var s;
    (s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :
    (s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
    (s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
    (s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :
    (s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0;

    //以下进行测试
    if (Sys.ie) document.write('IE: ' + Sys.ie);
    if (Sys.firefox) document.write('Firefox: ' + Sys.firefox);
    if (Sys.chrome) document.write('Chrome: ' + Sys.chrome);
    if (Sys.opera) document.write('Opera: ' + Sys.opera);
    if (Sys.safari) document.write('Safari: ' + Sys.safari);
</script>

将上述代码封装成一个方法,方法返回Sys对象,Sys对象中封装了浏览器的类型和版本信息,如下:

function getBrowserInfo(){
  var Sys = {};
  var ua = navigator.userAgent.toLowerCase();
  var re =/(msie|firefox|chrome|opera|version).*?([\d.]+)/;
  var m = ua.match(re);
  Sys.browser = m[1].replace(/version/, "'safari");
  Sys.ver = m[2];
  return Sys;
}

当需要获取浏览器的类型和版本信息时,就可以使用getBroserInfo方法,如下:

<script type="text/javascript">
     //获取当前的浏览器信息
     var sys = getBrowserInfo();
     //sys.browser得到浏览器的类型,sys.ver得到浏览器的版本
     document.write(sys.browser + "的版本是:" + sys.ver);
 </script>

完整测试代码如下:

<!DOCTYPE HTML>
<html>
 <head>
  <title>JavaScript获取浏览器类型与版本</title>
  <script type="text/javascript">
    var Sys = {};
    var ua = navigator.userAgent.toLowerCase();
    var s;
    (s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :
    (s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
    (s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
    (s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :
    (s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0;

    //以下进行测试
    if (Sys.ie) document.write('IE: ' + Sys.ie);
    if (Sys.firefox) document.write('Firefox: ' + Sys.firefox);
    if (Sys.chrome) document.write('Chrome: ' + Sys.chrome);
    if (Sys.opera) document.write('Opera: ' + Sys.opera);
    if (Sys.safari) document.write('Safari: ' + Sys.safari);
  </script>
  <script type="text/javascript">
    function getBrowserInfo(){
      var Sys = {};
      var ua = navigator.userAgent.toLowerCase();
      var re =/(msie|firefox|chrome|opera|version).*?([\d.]+)/;
      var m = ua.match(re);
      Sys.browser = m[1].replace(/version/, "'safari");
      Sys.ver = m[2];
      return Sys;
    }
    document.write('<hr/>');
    //获取当前的浏览器信息
    var sys = getBrowserInfo();
    //sys.browser得到浏览器的类型,sys.ver得到浏览器的版本
    document.write(sys.browser + "的版本是:" + sys.ver);
  </script>
 </head>
 
 <body>
  
 </body>
</html>

运行结果:

IE浏览器下测试结果:

javascript实现获取浏览器版本、浏览器类型

google浏览器下测试结果:

javascript实现获取浏览器版本、浏览器类型

火狐浏览器下测试结果:

javascript实现获取浏览器版本、浏览器类型

以上就是关于javascript实现获取浏览器版本及类型的详细代码,针对IE浏览器、火狐浏览器、google浏览器进行了测试,很成功,大家可以动手实践一下。

Javascript 相关文章推荐
Jquery 实现表格颜色交替变化鼠标移过颜色变化实例
Aug 28 Javascript
js函数在frame中的相互调用详解
Mar 03 Javascript
浅谈 jQuery 事件源码定位问题
Jun 18 Javascript
jQuery中slideUp()方法用法分析
Dec 24 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
Feb 02 Javascript
js获取当前页的URL与window.location.href简单方法
Feb 13 Javascript
jQuery实现的弹幕效果完整实例
Sep 06 jQuery
小程序实现五星点评效果
Nov 03 Javascript
VUE+elementui面包屑实现动态路由详解
Nov 04 Javascript
继承行为在 ES5 与 ES6 中的区别详解
Dec 24 Javascript
js根据后缀判断文件文件类型的代码
May 09 Javascript
vue 使用饿了么UI仿写teambition的筛选功能
Mar 01 Vue.js
JavaScript如何禁止Backspace键
Dec 02 #Javascript
js文本框输入内容智能提示效果
Dec 02 #Javascript
JavaScript使用DeviceOne开发实战(四)仿优酷视频应用
Dec 02 #Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
Dec 02 #Javascript
jQuery 1.9.1源码分析系列(十四)之常用jQuery工具
Dec 02 #Javascript
jQuery 1.9.1源码分析系列(十三)之位置大小操作
Dec 02 #Javascript
解决jQuery使用JSONP时产生的错误
Dec 02 #Javascript
You might like
谈谈PHP语法(5)
2006/10/09 PHP
缓存技术详谈―php
2006/12/14 PHP
服务器上配置PHP运行环境教程
2015/02/12 PHP
PHP中数据类型转换的三种方式
2015/04/02 PHP
php技术实现加载字体并保存成图片
2015/07/27 PHP
thinkphp修改配置进入默认首页的方法
2017/02/07 PHP
JavaScript 数组的 uniq 方法
2008/01/23 Javascript
jQuery.validate 常用方法及需要注意的问题
2013/03/20 Javascript
jQuery实现图片上传和裁剪插件Croppie
2015/11/29 Javascript
jQuery图片加载显示loading效果
2016/11/04 Javascript
JS实现选定指定HTML元素对象中指定文本内容功能示例
2017/02/13 Javascript
npm 更改默认全局路径以及国内镜像的方法
2018/05/16 Javascript
使用webpack编译es6代码的方法步骤
2019/04/28 Javascript
JavaScript中将值转换为字符串的五种方法总结
2019/06/06 Javascript
微信小程序中为什么使用var that=this
2019/08/27 Javascript
一步一步实现Vue的响应式(对象观测)
2019/09/02 Javascript
js+css实现全屏侧边栏
2020/06/16 Javascript
[50:50]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第一场 12.20
2020/12/23 DOTA
Python文件操作类操作实例详解
2014/07/11 Python
使用Python脚本将文字转换为图片的实例分享
2015/08/29 Python
Python使用win32com模块实现数据库表结构自动生成word表格的方法
2018/07/17 Python
python可视化实现代码
2019/01/15 Python
pyqt5 使用cv2 显示图片,摄像头的实例
2019/06/27 Python
Python 之 Json序列化嵌套类方式
2020/02/27 Python
MxNet预训练模型到Pytorch模型的转换方式
2020/05/25 Python
Python 存取npy格式数据实例
2020/07/01 Python
安装不同版本的tensorflow与models方法实现
2021/02/20 Python
HTML5中的进度条progress元素简介及兼容性处理
2016/06/02 HTML / CSS
EJB的几种类型
2012/08/15 面试题
在职人员函授期间自我评价分享
2013/11/08 职场文书
订货会邀请函
2015/01/31 职场文书
自荐信格式范文
2015/03/04 职场文书
面试复试通知单
2015/04/24 职场文书
四群教育工作总结
2015/08/10 职场文书
springboot集成flyway自动创表的详细配置
2021/06/26 Java/Android
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS