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 相关文章推荐
学习ExtJS(二) Button常用方法
Oct 07 Javascript
Extjs 4.x 得到form CheckBox 复选框的值
May 04 Javascript
原生js和jQuery随意改变div属性style的名称和值
Oct 22 Javascript
node.js中watch机制详解
Nov 17 Javascript
JS中字符串trim()使用示例
May 26 Javascript
jQuery实现限制textarea文本框输入字符数量的方法
May 28 Javascript
跟我学习javascript的执行上下文
Nov 18 Javascript
Jquery easyui开启行编辑模式增删改操作
Jan 14 Javascript
五步轻松实现JavaScript HTML时钟效果
Mar 25 Javascript
基于Vue实现关键词实时搜索高亮显示关键词
Jul 21 Javascript
axios如何利用promise无痛刷新token的实现方法
Aug 27 Javascript
基于vuex实现购物车功能
Jan 10 Vue.js
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
yii实现CheckBox复选框在同一行显示的方法
2014/12/03 PHP
PHP序列化操作方法分析
2016/09/28 PHP
php 判断IP为有效IP地址的方法
2018/01/28 PHP
Juqery Html(),append()等方法的Bug解决方法
2010/12/13 Javascript
怎么清空javascript数组
2013/05/11 Javascript
jquery的each方法使用示例分享
2014/03/25 Javascript
CSS3实现动态背景登录框的代码
2015/07/28 Javascript
微信小程序访问node.js接口服务器搭建教程
2017/04/25 Javascript
bootstrap模态框远程示例代码分享
2017/05/22 Javascript
vue如何使用 Slot 分发内容实例详解
2017/09/05 Javascript
在vue中,v-for的索引index在html中的使用方法
2018/03/06 Javascript
使用 Angular RouteReuseStrategy 缓存(路由)组件的实例代码
2019/11/01 Javascript
node.js使用 http-proxy 创建代理服务器操作示例
2020/02/10 Javascript
JavaScript Blob对象原理及用法详解
2020/10/14 Javascript
echarts饼图各个板块之间的空隙如何实现
2020/12/01 Javascript
[02:03]永远的信仰DOTA2 中国军团历届国际邀请赛回顾
2016/06/26 DOTA
Python3单行定义多个变量或赋值方法
2018/07/12 Python
python用fsolve、leastsq对非线性方程组求解
2018/12/15 Python
解决Pycharm调用Turtle时 窗口一闪而过的问题
2019/02/16 Python
python 字符串追加实例
2019/07/20 Python
基于python的列表list和集合set操作
2019/11/24 Python
Python安装依赖(包)模块方法详解
2020/02/14 Python
TensorFlow Autodiff自动微分详解
2020/07/06 Python
谈谈python垃圾回收机制
2020/09/27 Python
Python字符串查找基本操作代码案例
2020/10/27 Python
Python爬虫教程之利用正则表达式匹配网页内容
2020/12/08 Python
解决CSS3的opacity属性带来的层叠顺序问题
2016/05/09 HTML / CSS
美国第二大连锁药店:Rite Aid
2019/04/03 全球购物
T3官网:头发造型工具
2019/12/26 全球购物
机械制造专业个人的自我评价
2013/12/28 职场文书
数控技术应用个人求职信范文
2014/02/03 职场文书
财政局党的群众路线教育实践活动整改方案
2014/09/21 职场文书
个人查摆问题及整改措施
2014/10/16 职场文书
初中成绩单评语
2014/12/29 职场文书
工作态度不好检讨书
2015/05/06 职场文书
python实现图片批量压缩
2021/04/24 Python