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 相关文章推荐
让焦点自动跳转
Jul 01 Javascript
通过MSXML2自动获取QQ个人头像及在线情况(给初学者)
Jan 22 Javascript
ExtJS4给Combobox设置列表中的默认值示例
May 02 Javascript
使用JavaScript链式编程实现模拟Jquery函数
Dec 21 Javascript
javascript移动开发中touch触摸事件详解
Mar 18 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
js内置对象处理_打印学生成绩单的简单实现
Sep 24 Javascript
Vuex之理解Store的用法
Apr 19 Javascript
微信小程序表单弹窗实例
Jul 19 Javascript
js根据json数据中的某一个属性来给数据分组的方法
Oct 08 Javascript
js实现京东秒杀倒计时功能
Jan 21 Javascript
jquery实现吸顶导航效果
Jan 08 jQuery
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通用防注入程序 推荐
2011/02/26 PHP
推荐几款用 Sublime Text 开发 Laravel 所用到的插件
2014/10/30 PHP
PHP执行SQL文件并将SQL文件导入到数据库
2015/09/17 PHP
PHP利用APC模块实现大文件上传进度条的方法
2015/10/29 PHP
thinkPHP中volist标签用法示例
2016/12/06 PHP
Google Suggest ;-) 基于js的动态下拉菜单
2006/10/11 Javascript
高亮显示web页表格行的javascript代码
2010/11/19 Javascript
利用js的Node遍历找到repeater的一个字段实例介绍
2013/04/25 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
2014/03/05 Javascript
[原创]推荐10款最热门jQuery UI框架
2014/08/19 Javascript
JavaScript中日期的相关操作方法总结
2015/10/24 Javascript
学习JavaScript设计模式(封装)
2015/11/26 Javascript
JavaScript学习笔记之数组求和方法
2016/03/23 Javascript
JS深度拷贝Object Array实例分析
2016/03/31 Javascript
Bootstrap幻灯片轮播图支持触屏左右手势滑动的实现方法
2016/10/13 Javascript
vue一步步实现alert功能
2017/07/05 Javascript
使用cookie绕过验证码登录的实现代码
2017/10/12 Javascript
AngularJS动态生成select下拉框的方法实例
2019/11/17 Javascript
angular8和ngrx8结合使用的步骤介绍
2019/12/01 Javascript
JavaScript随机数的组合问题案例分析
2020/05/16 Javascript
解决iview table组件里的 固定列 表格不自适应的问题
2020/11/13 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
Python处理json字符串转化为字典的简单实现
2016/07/07 Python
Python实现获取命令行输出结果的方法
2017/06/10 Python
实例介绍Python中整型
2019/02/11 Python
Python基于Serializer实现字段验证及序列化
2020/11/04 Python
python 用opencv实现图像修复和图像金字塔
2020/11/27 Python
CSS3.0实现霓虹灯按钮动画特效的示例代码
2021/01/12 HTML / CSS
HTML5 Canvas+JS控制电脑或手机上的摄像头实例
2014/05/03 HTML / CSS
朗仕(Lab series)英国官网:雅诗兰黛集团男士专属护肤品牌
2017/11/28 全球购物
德国W家官网,可直邮中国的母婴商城:Windeln.de
2021/03/03 全球购物
教师竞聘上岗演讲稿
2014/09/03 职场文书
2014年应急管理工作总结
2014/11/26 职场文书
帝企鹅日记观后感
2015/06/10 职场文书
小公司融资,商业计划书的8切记
2019/07/15 职场文书
python状态机transitions库详解
2021/06/02 Python