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 相关文章推荐
Event altKey,ctrlKey,shiftKey属性解析
Dec 18 Javascript
javascript对中文按照拼音排序代码
Aug 20 Javascript
JavaScript数组前面插入元素的方法
Apr 06 Javascript
JQuery Ajax WebService传递参数的简单实例
Nov 02 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
Feb 08 Javascript
微信小程序-获得用户输入内容
Feb 13 Javascript
JavaScript控制输入框中只能输入中文、数字和英文的方法【基于正则实现】
Mar 03 Javascript
jquery表单提交带错误信息提示效果
Mar 09 Javascript
ES6中Generator与异步操作实例分析
Mar 31 Javascript
for循环 + setTimeout 结合一些示例(前端面试题)
Aug 30 Javascript
在vue中使用公共过滤器filter的方法
Jun 26 Javascript
详解webpack打包第三方类库的正确姿势
Oct 20 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/ThinkPHP实现批量打包下载文件的方法示例
2017/07/31 PHP
PHP优化之批量操作MySQL实例分析
2020/04/23 PHP
面向对象的javascript(笔记)
2009/10/06 Javascript
js限制文本框为整数和货币的函数代码
2010/10/13 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
判断是否安装flash player及当前版本的JS代码
2013/08/08 Javascript
Knockout text绑定DOM的使用方法
2013/11/15 Javascript
JavaScript中的数组特性介绍
2014/12/30 Javascript
JQuery设置时间段下拉选择实例
2014/12/30 Javascript
直接拿来用的页面跳转进度条JS实现
2016/01/06 Javascript
Angular.js如何从PHP读取后台数据
2016/03/24 Javascript
javascript基础知识讲解
2017/01/11 Javascript
微信小程序技巧之show内容展示,上传文件编码问题
2017/01/23 Javascript
图文介绍Vue父组件向子组件传值
2018/02/17 Javascript
Vue 项目代理设置的优化
2018/04/17 Javascript
详解bootstrap-fileinput文件上传控件的亲身实践
2019/03/21 Javascript
python基于urllib实现按照百度音乐分类下载mp3的方法
2015/05/25 Python
Python中的多行注释文档编写风格汇总
2016/06/16 Python
十分钟利用Python制作属于你自己的个性logo
2018/05/07 Python
Matplotlib 生成不同大小的subplots实例
2018/05/25 Python
解决Python print输出不换行没空格的问题
2018/11/14 Python
Python matplotlib通过plt.scatter画空心圆标记出特定的点方法
2018/12/13 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
Python3.5装饰器典型案例分析
2019/04/30 Python
pyQt5实时刷新界面的示例
2019/06/25 Python
解决Django中调用keras的模型出现的问题
2019/08/07 Python
Python小程序 控制鼠标循环点击代码实例
2019/10/08 Python
通过 Django Pagination 实现简单分页功能
2019/11/11 Python
使用django和vue进行数据交互的方法步骤
2019/11/11 Python
Python3 实现爬取网站下所有URL方式
2020/01/16 Python
TensorFlow实现自定义Op方式
2020/02/04 Python
深入理解HTML5定时器requestAnimationFrame的使用
2018/12/12 HTML / CSS
Vans奥地利官方网站:美国原创极限运动潮牌
2018/09/30 全球购物
运动会解说词50字
2014/01/18 职场文书
怎么写好自荐书
2014/03/02 职场文书
中小学教师继续教育心得体会
2016/01/19 职场文书