javascript判断chrome浏览器的方法


Posted in Javascript onMarch 26, 2014

通过userAgent判断检测一下userAgent返回的字符串里面是否包含“Chrome”, 具体怎么检测是通过indexOf方法进行的。

<script type="text/javascript">
  var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;
  alert(isChrome);
  if (isChrome) {
    alert("是Chrome浏览器");
  } else {
    alert("不是Chrome浏览器");
  }
</script>

关于indexOf方法:

indexOf方法返回一个整数值,指出String对象内子字符串的开始位置。即indexOf()括号内所包含的字符在该字符串内的位置,在第几位就返回几,从0开始记数。如果有重复的字符出现,以第一个字符为准。如果没有找到子字符串,则返回 -1。

 JS通过内核判断各种浏览器|区分360与谷歌(亲测可用)

function getBrowserInfo(){
    var ua = navigator.userAgent.toLocaleLowerCase();
    var browserType=null;
    if (ua.match(/msie/) != null || ua.match(/trident/) != null) {
      browserType = "IE";
      browserVersion = ua.match(/msie ([\d.]+)/) != null ? ua.match(/msie ([\d.]+)/)[1] : ua.match(/rv:([\d.]+)/)[1];
    } else if (ua.match(/firefox/) != null) {
      browserType = "火狐";
    }else if (ua.match(/ubrowser/) != null) {
      browserType = "UC";
    }else if (ua.match(/opera/) != null) {
      browserType = "欧朋";
    } else if (ua.match(/bidubrowser/) != null) {
      browserType = "百度";
    }else if (ua.match(/metasr/) != null) {
      browserType = "搜狗";
    }else if (ua.match(/tencenttraveler/) != null || ua.match(/qqbrowse/) != null) {
      browserType = "QQ";
    }else if (ua.match(/maxthon/) != null) {
      browserType = "遨游";
    }else if (ua.match(/chrome/) != null) {
      var is360 = _mime("type", "application/vnd.chromium.remoting-viewer");
      function _mime(option, value) {
        var mimeTypes = navigator.mimeTypes;
        for (var mt in mimeTypes) {
          if (mimeTypes[mt][option] == value) {
            return true;
          }
        }
        return false;
      }
      if(is360){
        browserType = '360';
      }else{
        $('html').css("zoom",".80");
      }
    }else if (ua.match(/safari/) != null) {
      browserType = "Safari";
    }
}

只有原生Chrome中存在一种MimeType“application/vnd.chromium.remoting-viewer”,由此可以判断浏览器是加壳Chrome或是原生Chrome。
再如,只有IE内核的浏览器存在ActiveXObject对象。由此可以判断是否为IE浏览器

判断浏览器类型,我们需要遵循以下原则:

1、采取命中特征原则,当且仅当完全符合区分浏览器的特征时我们才会采用此特征。例如单纯通过UA中MSIE来检测是否为IE浏览器是不可靠的。而通过判断是否存在MimeType“application/vnd.chromium.remoting-viewer”来断言原生Chrome在现阶段来看是可行性,但也不保证永久有效。
2、对于主流浏览器来说一般不存在UserAgent关键字冲突,但对于许多加壳浏览器者就不一定了。再次提出某数字浏览器,userAgent干脆和IE一模一样,但渲染模式等等不不知道动了什么手脚,与标准IE行为差异很大。通过userAgent来判断浏览器时,优先命中浏览器特征字。匹配则基本确定为该浏览器,但未匹配也并不代表不是此浏览器。请悉知。
3、优先使用浏览器特性来区分浏览器,因为这个准确性较高。其次再采用userAgent辅助判断,从而达到最高的匹配度。
4、优先检测第三方加壳浏览器,目前并未有十分好的方案,只能枚举大部分世面上存在并可以判断的浏览器,其他未匹配任何规则的浏览器,为了兼容,请将规则落到四大浏览器之一。
5、判断浏览器版本,仅仅是为了针对特定浏览器进行优化,需要有特定的业务场景需要才要这么做。或者当某个浏览器出现兼容问题时,紧急添加针对浏览器的补丁代码时才判断。更加科学稳妥的办法是使用标准的JS函数和API,页面元素和样式设计遵循W3C标准。可能存在争议的兼容性问题尽可能采用第三方框架如jQuery。这才是解决兼容性问题的根本。
下面附上最近整理规纳判断浏览器类型的代码

Javascript 相关文章推荐
JavaScript 图片预览效果 推荐
Dec 22 Javascript
js操纵dom生成下拉列表框的方法
Feb 24 Javascript
用jquery写的菜单从左往右滑动出现
Apr 11 Javascript
jQuery使用cookie与json简单实现购物车功能
Apr 15 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
Jun 05 Javascript
Javascript闭包与函数柯里化浅析
Jun 22 Javascript
JavaScript 数组- Array的方法总结(推荐)
Jul 21 Javascript
jQuery ready()和onload的加载耗时分析
Sep 08 Javascript
javascript简单写的判断电话号码实例
May 24 Javascript
Vue报错:Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#‘的解决方法
Jun 17 Javascript
在小程序Canvas中使用measureText的方法示例
Oct 19 Javascript
Vue封装的组件全局注册并引用
Jul 24 Javascript
Javascript 浮点运算精度问题分析与解决
Mar 26 #Javascript
javascript 3d 逐侦产品展示(核心精简)
Mar 26 #Javascript
Node.js模拟浏览器文件上传示例
Mar 26 #Javascript
JavaScript关闭当前页面(窗口)不带任何提示
Mar 26 #Javascript
JavaScript数字和字符串转换示例
Mar 26 #Javascript
jquery实现瀑布流效果分享
Mar 26 #Javascript
jquery实现效果比较好的table选中行颜色
Mar 25 #Javascript
You might like
memcache命令启动参数中文解释
2014/01/13 PHP
PHP实现批量修改文件后缀名的方法
2015/07/30 PHP
Yii框架上传图片用法总结
2016/03/28 PHP
centos+php+coreseek+sphinx+mysql之一coreseek安装篇
2016/10/25 PHP
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
jquery checkbox全选、取消全选实现代码
2010/03/05 Javascript
js实现一个省市区三级联动选择框代码分享
2013/03/06 Javascript
jquery图片不完全按比例自动缩小的简单代码
2013/07/29 Javascript
js 点击页面其他地方关闭弹出层(示例代码)
2013/12/24 Javascript
Jquery 在页面加载后执行的几种方式
2014/03/14 Javascript
jQuery Validate表单验证插件的基本使用方法及功能拓展
2017/01/04 Javascript
Node.JS利用PhantomJs抓取网页入门教程
2017/05/19 Javascript
jquery鼠标悬停导航下划线滑出效果
2017/09/29 jQuery
Node.js实现注册邮箱激活功能的方法示例
2018/03/23 Javascript
详解vue为什么要求组件模板只能有一个根元素
2019/07/22 Javascript
vue 自动化路由实现代码
2019/09/03 Javascript
vue中keep-alive内置组件缓存的实例代码
2020/04/16 Javascript
用Angular实现一个扫雷的游戏示例
2020/05/15 Javascript
微信小程序实现自定义动画弹框/提示框的方法实例
2020/11/06 Javascript
js 数据类型判断的方法
2020/12/03 Javascript
three.js显示中文字体与tween应用详析
2021/01/04 Javascript
利用Python如何生成随机密码
2016/04/20 Python
解读python logging模块的使用方法
2018/04/17 Python
Python Logging 日志记录入门学习
2018/06/02 Python
基于python+selenium的二次封装的实现
2020/01/06 Python
如何使用python记录室友的抖音在线时间
2020/06/29 Python
python opencv实现图像配准与比较
2021/02/09 Python
html5 localStorage本地存储_动力节点Java学院整理
2017/07/06 HTML / CSS
英国最大的独立家具零售商:Furniture Village
2016/09/06 全球购物
澳大利亚最受欢迎的美发用品目的地:AMR
2019/08/28 全球购物
英国现代、当代和设计师家具店:Furntastic
2020/07/18 全球购物
实现strstr功能,即在父串中寻找子串首次出现的位置
2016/08/05 面试题
几道Java和数据库的面试题
2013/05/30 面试题
上班迟到检讨书范文
2015/05/06 职场文书
Python scrapy爬取起点中文网小说榜单
2021/06/13 Python
小程序与后端Java接口交互实现HelloWorld入门
2021/07/09 Java/Android