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 相关文章推荐
node.js学习总结之调式代码的方法
Jun 25 Javascript
jQuery实用技巧必备(中)
Nov 03 Javascript
AngularJS实现全选反选功能
Dec 08 Javascript
jQuery简单实现提交数据出现loading进度条的方法
Mar 29 Javascript
Node.js安装配置图文教程
May 10 Javascript
react native带索引的城市列表组件的实例代码
Aug 08 Javascript
jQuery实现基本隐藏与显示效果的方法详解
Sep 05 jQuery
微信小程序实现同一页面取值的方法分析
Apr 30 Javascript
vue使用localStorage保存登录信息 适用于移动端、PC端
May 27 Javascript
JS数组扁平化(flat)方法总结详解
Jun 24 Javascript
20道JS原理题助你面试一臂之力(必看)
Jul 22 Javascript
jQuery实现动态向上滚动
Dec 21 jQuery
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常用技巧总结(附函数代码)
2012/02/04 PHP
php利用cookies实现购物车的方法
2014/12/10 PHP
PHP curl使用实例
2015/07/02 PHP
php外部执行命令函数用法小结
2016/10/11 PHP
微信小程序发送订阅消息的方法(php 为例)
2019/10/30 PHP
Jquery Ajax学习实例5 向WebService发出请求,返回泛型集合数据的异步调用
2010/03/17 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
JS实现超精简的链接列表在固定区域内滚动效果代码
2015/11/04 Javascript
一些实用性较高的js方法
2016/04/19 Javascript
客户端(vue框架)与服务器(koa框架)通信及服务器跨域配置详解
2017/08/26 Javascript
bootstrap实现二级下拉菜单效果
2017/11/23 Javascript
浅谈Redux中间件的实践
2018/07/27 Javascript
使用Vue父子组件通信实现todolist的功能示例代码
2019/04/11 Javascript
js实现继承的方法及优缺点总结
2019/05/08 Javascript
微信端调取相册和摄像头功能,实现图片上传,并上传到服务器
2019/05/16 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
2020/02/01 Javascript
原生js实现的观察者和订阅者模式简单示例
2020/04/18 Javascript
解决VUE项目localhost端口服务器拒绝连接,只能用127.0.0.1的问题
2020/08/14 Javascript
[37:22]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第一局
2016/02/28 DOTA
Python编程语言的35个与众不同之处(语言特征和使用技巧)
2014/07/07 Python
Python实现使用卷积提取图片轮廓功能示例
2018/05/12 Python
Django分页查询并返回jsons数据(中文乱码解决方法)
2018/08/02 Python
pygame实现简易飞机大战
2018/09/11 Python
python集合常见运算案例解析
2019/10/17 Python
python tkinter canvas使用实例
2019/11/04 Python
什么是Python变量作用域
2020/06/03 Python
python中数字是否为可变类型
2020/07/08 Python
python 两种方法修改文件的创建时间、修改时间、访问时间
2020/09/26 Python
护士辞职信模板
2014/01/20 职场文书
正风肃纪剖析材料
2014/02/18 职场文书
个人授权委托书
2014/04/03 职场文书
2014年国庆节活动总结
2014/08/26 职场文书
工资收入证明样本(5篇)
2014/09/16 职场文书
辞职信标准格式
2015/02/27 职场文书
Python实战之用tkinter库做一个鼠标模拟点击器
2021/04/27 Python
Python实现信息管理系统
2022/06/05 Python