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 相关文章推荐
JS文本框追加多个下拉框的值的简单实例
Jul 12 Javascript
javaScript 动态访问JSon元素示例代码
Aug 30 Javascript
jquery实现按Enter键触发事件示例
Sep 10 Javascript
上传图片js判断图片尺寸和格式兼容IE
Sep 01 Javascript
javascript实现详细时间提醒信息效果的方法
Mar 11 Javascript
对Angular.js Controller如何进行单元测试
Oct 25 Javascript
AngularJS实现表格的增删改查(仅限前端)
Jul 04 Javascript
Three.js基础学习之场景对象
Sep 27 Javascript
vue form check 表单验证的实现代码
Dec 09 Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
Mar 06 Javascript
vue实现的请求服务器端API接口示例
May 25 Javascript
JS字符串补全方法padStart()和padEnd()
May 27 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 程序员应该使用的10个组件
2009/10/31 PHP
PHP-CGI进程CPU 100% 与 file_get_contents 函数的关系分析
2011/08/15 PHP
探讨PHP中this,self,parent的区别详解
2013/06/08 PHP
php calender(日历)二个版本代码示例(解决2038问题)
2013/12/24 PHP
php curl模拟post提交数据示例
2013/12/31 PHP
php强制用户转向www域名的方法
2015/06/19 PHP
PHP文件操作方法汇总
2015/07/01 PHP
优化javascript的执行速度
2010/01/23 Javascript
Jquery Ajax请求代码(2)
2011/01/07 Javascript
jquery实现input输入框实时输入触发事件代码
2014/01/28 Javascript
JS获取网页图片name属性的方法
2015/04/01 Javascript
基于vuejs实现一个todolist项目
2017/04/11 Javascript
详解AngularJS 模块化
2017/06/14 Javascript
vue生命周期和react生命周期对比【推荐】
2018/09/19 Javascript
ajax与jsonp的区别及用法
2018/10/16 Javascript
详解@Vue/Cli 3 Invalid Host header 错误解决办法
2019/01/02 Javascript
vue vantUI实现文件(图片、文档、视频、音频)上传(多文件)
2019/10/15 Javascript
javascript严格模式详解(含严格模式与非严格模式的区别)
2019/11/12 Javascript
详解Webpack抽离第三方类库以及common解决方案
2020/03/30 Javascript
Python3基础之函数用法
2014/08/13 Python
python自定义类并使用的方法
2015/05/07 Python
Python下实现的RSA加密/解密及签名/验证功能示例
2017/07/17 Python
Python语言描述连续子数组的最大和
2018/01/04 Python
python 处理dataframe中的时间字段方法
2018/04/10 Python
python实现的爬取电影下载链接功能示例
2019/08/26 Python
pytorch 指定gpu训练与多gpu并行训练示例
2019/12/31 Python
使用jupyter notebook直接打开.md格式的文件
2020/04/10 Python
Jupyter打开图形界面并画出正弦函数图像实例
2020/04/24 Python
Nike俄罗斯官方网站:Nike RU
2021/03/05 全球购物
shell程序如何生命变量?shell变量是弱变量吗?
2014/11/10 面试题
中学生寄语大全
2014/04/03 职场文书
家长建议怎么写
2014/05/15 职场文书
同意转租证明
2015/06/24 职场文书
新手入门Mysql--概念
2021/06/18 MySQL
springboot中rabbitmq实现消息可靠性机制详解
2021/09/25 Java/Android
JS数组去重详情
2021/11/07 Javascript