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 相关文章推荐
用js实现随机返回数组的一个元素
Aug 13 Javascript
jquery分页插件jpaginate在IE中不兼容问题
Apr 22 Javascript
js中各种类型的变量在if条件中是true还是false
Jul 16 Javascript
node.js中的fs.realpathSync方法使用说明
Dec 16 Javascript
JS+CSS实现鼠标滑过时动态翻滚的导航条效果
Sep 24 Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
Nov 13 Javascript
实例详解JSON数据格式及json格式数据域字符串相互转换
Jan 07 Javascript
基于JS+Canves实现点击按钮水波纹效果
Sep 15 Javascript
bootstrap3 dialog 更强大、更灵活的模态框
Apr 20 Javascript
Vue.js中的组件系统
May 30 Javascript
vue 更改连接后台的api示例
Nov 11 Javascript
如何在node环境实现“get数据解析”代码实例
Jul 03 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
phpwind中的数据库操作类
2007/01/02 PHP
php set_time_limit()函数的使用详解
2013/06/05 PHP
php实现查询百度google收录情况(示例代码)
2013/08/02 PHP
php中Session的生成机制、回收机制和存储机制探究
2014/08/19 PHP
PHP数组排序之sort、asort与ksort用法实例
2014/09/08 PHP
PHP实现的观察者模式实例
2017/06/21 PHP
Zend Framework框架中实现Ajax的方法示例
2017/06/27 PHP
php使用redis的几种常见操作方式和用法示例
2020/02/20 PHP
基于jquery的超简单上下翻
2010/04/20 Javascript
jQuery 获取对象 基本选择与层级
2010/05/31 Javascript
javascript 实用的文字链提示框效果
2010/06/30 Javascript
JQuery UI的拖拽功能实现方法小结
2012/03/14 Javascript
jQuery动画效果animate和scrollTop结合使用实例
2014/04/02 Javascript
浅谈document.write()输出样式
2015/05/07 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
深入理解关于javascript中apply()和call()方法的区别
2016/04/12 Javascript
JavaScript必知必会(九)function 说起 闭包问题
2016/06/08 Javascript
分享jQuery封装好的一些常用操作
2016/07/28 Javascript
JQuery Ajax WebService传递参数的简单实例
2016/11/02 Javascript
微信小程序实现两个页面传值的方法分析
2018/12/11 Javascript
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
vue实现下载文件流完整前后端代码
2020/11/17 Vue.js
使用python将请求的requests headers参数格式化方法
2019/01/02 Python
一行Python代码过滤标点符号等特殊字符
2019/08/12 Python
keras中的History对象用法
2020/06/19 Python
python如何构建mock接口服务
2021/01/28 Python
IE兼容css3圆角的实现代码
2011/07/21 HTML / CSS
美国最好的葡萄酒网上商店:Wine Library
2019/11/02 全球购物
FirstCry阿联酋儿童和婴儿产品网上购物:FirstCry.ae
2021/02/22 全球购物
《大海那边》教学反思
2014/04/09 职场文书
毕业证丢失证明范本
2014/09/20 职场文书
泸县召开党的群众路线教育实践活动总结大会新闻稿
2014/10/21 职场文书
导游词400字
2015/02/13 职场文书
2015年度校学生会工作总结报告
2015/05/23 职场文书
五年级数学教学反思
2016/02/16 职场文书
李白经典诗之一:全文无一“月”字,却句句有月
2019/07/12 职场文书