JS判断浏览器类型与操作系统的方法分析


Posted in Javascript onApril 30, 2020

本文实例讲述了JS判断浏览器类型与操作系统的方法。分享给大家供大家参考,具体如下:

navigator.userAgent : userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。

navigator.platform : platform 属性是一个只读的字符串,声明了运行浏览器的操作系统和(或)硬件平台。

判断浏览器类型

IE浏览器

ie = ua.match( /MSIE\s([\d\.]+)/ ) || ua.match( /(?:trident)(?:.*rv:([\w.]+))?/i ),

IE浏览器版本号

/msie 8.0/.test(navigator.userAgent.toLowerCase())

微信浏览器

/micromessenger/.test(navigator.userAgent.toLowerCase())

chrome

/chrome/.test(navigator.userAgent.toLowerCase())

firefox

/safari/.test(navigator.userAgent.toLowerCase())

opera

/micromessgenger/.test(navigator.userAgent.toLowerCase())

判断操作系统类型

win操作系统

navigator.platform == "Win32"
 navigator.platform == "Windows"

mac操作系统

navigator.platform == "Mac68K"
   navigator.platform == "MacPPC"
   navigator.platform == "Macintosh"
   navigator.platform == "MacIntel"

andorid操作系统

if(/Linux/i.test(navigator.userAgent)){
     if(/android/i.test(navigator.userAgent.toLowerCase())){
       return "android";
     }
   }
/**
     * @description 简单的浏览器检查结果。
     *
     * * `webkit` webkit版本号,如果浏览器为非webkit内核,此属性为`undefined`。
     * * `chrome` chrome浏览器版本号,如果浏览器为chrome,此属性为`undefined`。
     * * `ie` ie浏览器版本号,如果浏览器为非ie,此属性为`undefined`。**暂不支持ie10+**
     * * `firefox` firefox浏览器版本号,如果浏览器为非firefox,此属性为`undefined`。
     * * `safari` safari浏览器版本号,如果浏览器为非safari,此属性为`undefined`。
     * * `opera` opera浏览器版本号,如果浏览器为非opera,此属性为`undefined`。
     *
     * @property {Object} [browser]
     */
    browser: (function( ua ) {
      var ret = {},
        webkit = ua.match( /WebKit\/([\d.]+)/ ),
        chrome = ua.match( /Chrome\/([\d.]+)/ ) ||
          ua.match( /CriOS\/([\d.]+)/ ),

        ie = ua.match( /MSIE\s([\d\.]+)/ ) ||
          ua.match( /(?:trident)(?:.*rv:([\w.]+))?/i ),
        firefox = ua.match( /Firefox\/([\d.]+)/ ),
        safari = ua.match( /Safari\/([\d.]+)/ ),
        opera = ua.match( /OPR\/([\d.]+)/ );

      webkit && (ret.webkit = parseFloat( webkit[ 1 ] ));
      chrome && (ret.chrome = parseFloat( chrome[ 1 ] ));
      ie && (ret.ie = parseFloat( ie[ 1 ] ));
      firefox && (ret.firefox = parseFloat( firefox[ 1 ] ));
      safari && (ret.safari = parseFloat( safari[ 1 ] ));
      opera && (ret.opera = parseFloat( opera[ 1 ] ));

      return ret;
    })( navigator.userAgent ),

    /**
     * @description 操作系统检查结果。
     *
     * * `android` 如果在android浏览器环境下,此值为对应的android版本号,否则为`undefined`。
     * * `ios` 如果在ios浏览器环境下,此值为对应的ios版本号,否则为`undefined`。
     * @property {Object} [os]
     */
    os: (function( ua ) {
      var ret = {},

        // osx = !!ua.match( /\(Macintosh\; Intel / ),
        android = ua.match( /(?:Android);?[\s\/]+([\d.]+)?/ ),
        ios = ua.match( /(?:iPad|iPod|iPhone).*OS\s([\d_]+)/ );

      // osx && (ret.osx = true);
      android && (ret.android = parseFloat( android[ 1 ] ));
      ios && (ret.ios = parseFloat( ios[ 1 ].replace( /_/g, '.' ) ));

      return ret;
    })( navigator.userAgent ),
Javascript 相关文章推荐
Javascript 文件夹选择框的两种解决方案
Jul 01 Javascript
jquery属性选择器not has怎么写 行悬停高亮显示
Nov 13 Javascript
jquery 新建的元素事件绑定问题解决方案
Jun 12 Javascript
JavaScript中的some()方法使用详解
Jun 09 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
防止重复发送 Ajax 请求
Feb 15 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
May 05 Javascript
再谈Angular4 脏值检测(性能优化)
Apr 23 Javascript
vue如何在自定义组件中使用v-model
May 14 Javascript
JavaScript数组基于交换的排序示例【冒泡排序】
Jul 21 Javascript
node基于async/await对mysql进行封装
Jun 20 Javascript
vue移动端写的拖拽功能示例代码
Sep 09 Javascript
JavaScript自定义超时API代码实例
Apr 30 #Javascript
javascript 模块依赖管理的本质深入详解
Apr 30 #Javascript
JavaScript find()方法及返回数据实例
Apr 30 #Javascript
js this 绑定机制深入详解
Apr 30 #Javascript
JS 图片压缩原理与实现方法详解
Apr 29 #Javascript
详解Vue3 Composition API中的提取和重用逻辑
Apr 29 #Javascript
浅谈Vue3 Composition API如何替换Vue Mixins
Apr 29 #Javascript
You might like
在PHP模板引擎smarty生成随机数的方法和math函数详解
2014/04/24 PHP
解决CodeIgniter伪静态失效
2014/06/09 PHP
php封装一个异常的处理类
2017/06/08 PHP
PHP中error_reporting函数用法详细介绍
2017/06/11 PHP
thinkPHP事务操作简单案例分析
2019/10/17 PHP
jQuery 操作XML入门
2008/12/25 Javascript
一些实用的jQuery代码片段收集
2011/07/12 Javascript
JavaScript实现简单图片滚动附源码下载
2014/06/17 Javascript
jquery中each遍历对象和数组示例
2014/08/05 Javascript
jQuery实现的向下图文信息滚动效果
2015/05/03 Javascript
酷! 不同风格页面布局幻灯片特效js实现
2021/02/19 Javascript
AngularJS使用带属性值的ng-app指令实现自定义模块自动加载的方法
2017/01/04 Javascript
vue调用高德地图实例代码
2017/04/28 Javascript
angular学习之从零搭建一个angular4.0项目
2017/07/10 Javascript
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
2018/04/26 jQuery
vue: WebStorm设置快速编译运行的方法
2018/10/18 Javascript
Vue将页面导出为图片或者PDF
2020/08/17 Javascript
浅谈监听单选框radio改变事件(和layui中单选按钮改变事件)
2019/09/10 Javascript
jQuery实现轮播图效果
2019/11/26 jQuery
如何解决vue在ios微信"复制链接"功能问题
2020/03/26 Javascript
JavaScript点击按钮生成4位随机验证码
2021/01/28 Javascript
Python实现包含min函数的栈
2016/04/29 Python
Python实现备份MySQL数据库的方法示例
2018/01/11 Python
Tensorflow实现卷积神经网络用于人脸关键点识别
2018/03/05 Python
Python学习笔记之自定义函数用法详解
2019/06/08 Python
详解Python可视化神器Yellowbrick使用
2019/11/11 Python
python输出第n个默尼森数的实现示例
2020/03/08 Python
使用css3做0.5px的细线的示例代码
2018/01/18 HTML / CSS
中国第一家杂志折扣订阅网:杂志铺
2016/08/30 全球购物
Expedia挪威官网:酒店、机票和租车
2018/03/03 全球购物
用JAVA实现一种排序,JAVA类实现序列化的方法(二种)
2014/04/23 面试题
法院实习人员自我鉴定
2013/09/26 职场文书
网吧消防安全责任书
2014/07/29 职场文书
2014酒店客房部工作总结
2014/12/16 职场文书
房屋维修申请报告
2015/05/18 职场文书
教育教学工作反思
2016/02/24 职场文书