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 相关文章推荐
JQuery Dialog的内存泄露问题解决方法
Jun 18 Javascript
初窥JQuery(一)jquery选择符 必备知识点
Nov 25 Javascript
JavaScript单元测试ABC
Apr 12 Javascript
JavaScript实现广告弹窗效果
Aug 09 Javascript
使用JS实现图片展示瀑布流效果的实例代码
Sep 12 Javascript
JS实现的适合做faq或menu滑动效果示例
Nov 17 Javascript
js实现前端分页页码管理
Jan 06 Javascript
jQuery使用bind函数实现绑定多个事件的方法
Oct 11 jQuery
angular1配合gulp和bower的使用教程
Jan 19 Javascript
JavaScript比较同一天的时间大小实例代码
Feb 09 Javascript
详解ES6 Symbol 的用途
Oct 14 Javascript
Vue Extends 扩展选项用法完整实例
Sep 17 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
PHP利用COM对象访问SQLServer、Access
2006/10/09 PHP
PHP关联链接常用代码
2012/11/05 PHP
php实现获取文件mime类型的方法
2015/02/11 PHP
PHP中使用socket方式GET、POST数据实例
2015/04/02 PHP
PHP数据库操作Helper类完整实例
2016/05/11 PHP
PHP 应用容器化以及部署方法
2018/02/12 PHP
Yii框架的布局文件实例分析
2019/09/04 PHP
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
2013/03/18 Javascript
解析dom中的children对象数组元素firstChild,lastChild的使用
2013/07/10 Javascript
jquery中each方法示例和常用选择器
2014/07/08 Javascript
javascript文本模板用法实例
2015/07/31 Javascript
jquery判断输入密码两次是否相等
2020/04/22 Javascript
JavaScript高级程序设计(第三版)学习笔记1~5章
2016/03/11 Javascript
关于Jquery中的事件绑定总结
2016/10/26 Javascript
基于javascript的异步编程实例详解
2017/04/10 Javascript
jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法
2017/07/12 jQuery
使用javascript做在线算法编程
2018/05/25 Javascript
JavaScript正则表达式验证登录实例
2020/03/18 Javascript
js实现有趣的倒计时效果
2021/01/19 Javascript
详解javascript脚本何时会被执行
2021/02/05 Javascript
更改Python命令行交互提示符的方法
2015/01/14 Python
python实现下载指定网址所有图片的方法
2015/08/08 Python
python的pdb调试命令的命令整理及实例
2017/07/12 Python
python面向对象入门教程之从代码复用开始(一)
2018/12/11 Python
Python 使用office365邮箱的示例
2020/10/29 Python
CSS3教程(3):border-color网页边框色彩
2009/04/02 HTML / CSS
欧洲最大的化妆品连锁公司:Douglas道格拉斯
2017/05/06 全球购物
日本最大美瞳直送网:Morecontact(中文)
2019/04/03 全球购物
简单租房协议书
2014/04/09 职场文书
活动宣传策划方案
2014/05/23 职场文书
音乐教师求职信范文
2015/03/20 职场文书
员工家属慰问信
2015/03/24 职场文书
幼儿园2015年度工作总结
2015/04/01 职场文书
名人传读书笔记
2015/06/26 职场文书
Mysql分析设计表主键为何不用uuid
2022/03/31 MySQL
Nginx限流和黑名单配置
2022/05/20 Servers