js判断操作系统与浏览器

简介: js判断操作系统与浏览器

摘要:


  

对于前端开发我们最重要的工作就是兼容性,系统的兼容性,浏览器的兼容性等等。今天分享一个我在项目中封装的判断操作系统与浏览器的方法。


操作系统:


var os = (function() {
    var UserAgent = navigator.userAgent.toLowerCase();
    return {
        isIpad          : /ipad/.test(UserAgent),
        isIphone        : /iphone os/.test(UserAgent),
        isAndroid       : /android/.test(UserAgent),
        isWindowsCe     : /windows ce/.test(UserAgent),
        isWindowsMobile : /windows mobile/.test(UserAgent),
        isWin2K         : /windows nt 5.0/.test(UserAgent),
        isXP            : /windows nt 5.1/.test(UserAgent),
        isVista         : /windows nt 6.0/.test(UserAgent),
        isWin7          : /windows nt 6.1/.test(UserAgent),
        isWin8          : /windows nt 6.2/.test(UserAgent),
        isWin81         : /windows nt 6.3/.test(UserAgent),
        isMac           : /mac os/.test(UserAgent)
    };
}());


如果要判断系统是否是iPad,只需要判断if(os.isIpad) {}.


浏览器:


 

var bw = (function() {
    var UserAgent = navigator.userAgent.toLowerCase();
    return {
        isUc      : /ucweb/.test(UserAgent), // UC浏览器
        isChrome  : /chrome/.test(UserAgent.substr(-33,6)), // Chrome浏览器
        isFirefox : /firefox/.test(UserAgent), // 火狐浏览器
        isOpera   : /opera/.test(UserAgent),  // Opera浏览器
        isSafire  : /safari/.test(UserAgent) && !/chrome/.test(UserAgent), // safire浏览器
        is360     : /360se/.test(UserAgent), // 360浏览器
        isBaidu   : /bidubrowser/.test(UserAgent), // 百度浏览器
        isSougou  : /metasr/.test(UserAgent), // 搜狗浏览器
        isIE6     : /msie 6.0/.test(UserAgent), // IE6
        isIE7     : /msie 7.0/.test(UserAgent), // IE7
        isIE8     : /msie 8.0/.test(UserAgent), // IE8
        isIE9     : /msie 9.0/.test(UserAgent), // IE9
        isIE10    : /msie 10.0/.test(UserAgent), // IE10
        isIE11    : /msie 11.0/.test(UserAgent), // IE11
        isLB      : /lbbrowser/.test(UserAgent), // 猎豹浏览器
     isWX      : /micromessenger/.test(UserAgent), // 微信内置浏览器
        isQQ      : /qqbrowser/.test(UserAgent) // QQ浏览器
    };
}());


小结:


  

浏览器都是本人亲自测试的,可能会有问题的是chrome浏览器,因为大部分浏览器都是使用WebKit内核,所以我就把chrome的navigator截取出来区分。如果以后chrome的navigator的信息位置或者chrome之后的长度发生改变就容易出现问题,但目前来看是可以的。

相关文章
|
1月前
|
JavaScript
浏览器插件crx文件--JS混淆与解密
浏览器插件crx文件--JS混淆与解密
49 0
|
1月前
|
Web App开发 JavaScript 前端开发
浏览器与Node.js事件循环:异同点及工作原理
浏览器与Node.js事件循环:异同点及工作原理
|
1月前
|
前端开发 JavaScript Java
Java与JavaScript的区别与联系:有人的地方就有江湖,有浏览器的地方就有JavaScript
Java与JavaScript的区别与联系:有人的地方就有江湖,有浏览器的地方就有JavaScript
100 0
|
2天前
|
JavaScript 前端开发
js怎样获取浏览器窗口尺寸
js怎样获取浏览器窗口尺寸
|
2天前
|
JavaScript 前端开发
JavaScript BOM 浏览器对象模型
JavaScript BOM 浏览器对象模型
|
1月前
|
JavaScript 前端开发
Playwright执行 JavaScript 脚本:探索浏览器自动化的新境界
在Web自动化中,Playwright提供`page.evaluate()`和`page.evaluate_handle()`来执行JavaScript脚本。`page.evaluate()`返回脚本执行结果,而`page.evaluate_handle()`返回JSHandle。示例展示了如何使用它们,如打印网页标题、操作元素及获取页面内容。通过这些方法,可以处理常规方法难以操作的网页元素。
28 2
|
1月前
|
移动开发 JavaScript 前端开发
javascript监听浏览器离开、进入行为
javascript监听浏览器离开、进入行为
20 0
|
1月前
|
JavaScript 前端开发 开发者
JavaScript基础入门之浏览器控制台调试输出
本文章是对小白学习js的初级教程,也是我对自己学习经验的一种总结,文章大多采用使用案例加讲解,带动学习的方式.因为我们的天性总是喜欢有及时反馈的事物,但是学习是一个慢长的事情,而有结果的回应,才会更好的促进自己去学习,主要是对于javascript学习中的输出,有个大体上的了解,同时通过教学能够更好的使用浏览器来方便我们去学习和运行代码,也是对自己进行笔记整理,对抓住信息关键点的一种提高.
|
11天前
|
存储 Linux 数据处理
探索Linux操作系统的内核与文件系统
本文深入探讨了Linux操作系统的核心组件,包括其独特的内核结构和灵活的文件系统。文章首先概述了Linux内核的主要功能和架构,接着详细分析了文件系统的工作原理以及它如何支持数据存储和检索。通过比较不同的文件系统类型,本文旨在为读者提供一个关于如何根据特定需求选择合适文件系统的参考框架。
|
2天前
|
存储 缓存 安全
Linux基础——冯诺依曼体系结构与操作系统
Linux基础——冯诺依曼体系结构与操作系统
Linux基础——冯诺依曼体系结构与操作系统