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脚本
Aug 04 Javascript
jQuery 行背景颜色的交替显示(隔行变色)实现代码
Dec 13 Javascript
JS鼠标事件大全 推荐收藏
Nov 01 Javascript
JavaScript加强之自定义callback示例
Sep 21 Javascript
jquery搜索框效果实现方法
Jan 16 Javascript
D3.js中data(), enter() 和 exit()的问题详解
Aug 17 Javascript
JQuery实现左右滚动菜单特效
Sep 28 Javascript
angular4模块中给标签添加背景图的实现方法
Sep 15 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
小程序实现订单倒计时功能
Apr 23 Javascript
JS实现点餐自动选择框(案例分析)
Dec 10 Javascript
js页面加载后执行的几种方式小结
Jan 30 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 各种应用乱码问题的解决方法
2010/05/09 PHP
PHP从二维数组得到N层分类树的实现代码
2016/10/11 PHP
PHP日志LOG类定义与用法示例
2018/09/06 PHP
PHP的mysqli_sqlstate()函数讲解
2019/01/23 PHP
Laravel 前端资源配置教程
2019/10/18 PHP
php 使用ActiveMQ发送消息,与处理消息操作示例
2020/02/23 PHP
js实时监听文本框状态的方法
2011/04/26 Javascript
别了 JavaScript中的isXX系列
2012/08/01 Javascript
jquery 操作两个select实现值之间的互相传递
2014/03/07 Javascript
使用Jquery获取带特殊符号的ID 标签的方法
2014/04/30 Javascript
jquery插件hiAlert实现网页对话框美化
2015/05/03 Javascript
浅析BootStrap Treeview的简单使用
2016/10/12 Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
2016/10/27 Javascript
微信小程序开发之实现选项卡(窗口顶部TabBar)页面切换
2016/11/25 Javascript
了解VUE的render函数的使用
2017/06/08 Javascript
jQuery+SpringMVC中的复选框选择与传值实例
2018/01/08 jQuery
angularjs实现的购物金额计算工具示例
2018/05/08 Javascript
javascript使用canvas实现饼状图效果
2020/09/08 Javascript
vue.js封装switch开关组件的操作
2020/10/26 Javascript
python安装numpy&amp;安装matplotlib&amp; scipy的教程
2017/11/02 Python
Python实现决策树C4.5算法的示例
2018/05/30 Python
django写用户登录判定并跳转制定页面的实例
2019/08/21 Python
python 实现二维列表转置
2019/12/02 Python
pytorch查看torch.Tensor和model是否在CUDA上的实例
2020/01/03 Python
python设置表格边框的具体方法
2020/07/17 Python
Charlotte Tilbury澳大利亚官网:英国美妆品牌
2018/10/05 全球购物
韩国最大的购物网站:Gmarket
2019/06/20 全球购物
优秀员工个人的自我评价
2013/11/29 职场文书
建筑项目策划书
2014/01/13 职场文书
人力资源作业细则
2014/03/03 职场文书
研讨会主持词
2014/04/02 职场文书
园林专业毕业生自荐信
2014/07/04 职场文书
2015年植树节活动总结
2015/02/06 职场文书
新入职员工工作总结
2015/10/15 职场文书
送给客户微信问候语!
2019/07/04 职场文书
nginx实现动静分离的方法示例
2021/11/07 Servers