封装好的js判断操作系统与浏览器代码分享

 更新时间:2015年01月09日 10:54:31   投稿:hebedich  
这篇文章主要介绍了封装好的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)
  };
}());

如果要判断系统是否是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之后的长度发生改变就容易出现问题,但目前来看是可以的。

现在因为手机UC浏览器经常屏蔽百度的广告,但对google广告不屏蔽,我们可以加入判断是否为UC浏览器,不是就显示百度广告,是就显示google的广告

if(navigator.userAgent.indexOf('UCBrowser') > -1) {
alert("uc浏览器");
}else{
//不是uc浏览器执行的操作
}

其实具体的浏览器的一些特殊的操作可以通过

JS获取浏览器信息
浏览器代码名称:navigator.appCodeName
浏览器名称:navigator.appName
浏览器版本号:navigator.appVersion
对Java的支持:navigator.javaEnabled()
MIME类型(数组):navigator.mimeTypes
系统平台:navigator.platform
插件(数组):navigator.plugins
用户代理:navigator.userAgent

相关文章

  • 小程序中的箭头函数的具体使用

    小程序中的箭头函数的具体使用

    这篇文章主要介绍了小程序中的箭头函数的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-06-06
  • 微信小程序开发之你可能没有踩过的神坑总结

    微信小程序开发之你可能没有踩过的神坑总结

    最近在做一个小程序的项目,所以记录下开发过程中遇到的坑,这篇文章主要给大家介绍了关于微信小程序开发之你可能没有踩过的神坑,需要的朋友可以参考下
    2021-09-09
  • 微信小程序实现下拉框功能

    微信小程序实现下拉框功能

    这篇文章主要为大家详细介绍了微信小程序实现下拉框功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • js循环中使用正则失效异常的踩坑实战

    js循环中使用正则失效异常的踩坑实战

    这篇文章主要给大家介绍了关于js循环中使用正则失效异常的踩坑实战,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2023-05-05
  • javascript设计模式之装饰者模式

    javascript设计模式之装饰者模式

    这篇文章主要为大家详细介绍了javascript设计模式之装饰者模式,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-01-01
  • JavaScript从数组(数组对象)中删除特定数据的方法

    JavaScript从数组(数组对象)中删除特定数据的方法

    这篇文章主要给大家介绍了关于JavaScript从数组(数组对象)中删除特定数据的相关资料,js在前台界面中举足轻重,在使用js删除数组时遇到一些问题,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2023-09-09
  • 用js实现简单算法的实例代码

    用js实现简单算法的实例代码

    下面小编就为大家带来一篇用js实现简单算法的实例代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • 深入探究JavaScript的类型判断(从基础到精通)

    深入探究JavaScript的类型判断(从基础到精通)

    JavaScript 语言具有多种数据类型,它们可以大致分为两大类:基本数据类型(Primitive Data Types)和引用数据类型(Reference Data Types),本文将带大家一起从基础到精通深入探究JavaScript的类型判断,需要的朋友可以参考下
    2024-05-05
  • Postman参数化实现过程及原理解析

    Postman参数化实现过程及原理解析

    这篇文章主要介绍了Postman参数化实现过程及原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-08-08
  • javascript实现复制与粘贴操作实例

    javascript实现复制与粘贴操作实例

    这篇文章主要介绍了javascript实现复制与粘贴操作,以实例形式讲述了javascript实现复制与粘贴操作的实现方法,需要的朋友可以参考下
    2014-10-10

最新评论