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 相关文章推荐
NiftyCube——轻松实现圆角边框
Feb 20 Javascript
javaScript 判断字符串是否为数字的简单方法
Jul 25 Javascript
javascript 鼠标悬浮图片显示原图 移出鼠标后原图消失(多图)
Dec 28 Javascript
jQuery 方法大全方便学习参考
Feb 25 Javascript
很好用的js日历算法详细代码
Mar 07 Javascript
jQuery中fadeIn、fadeOut、fadeTo的使用方法(图片显示与隐藏)
May 08 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
Mar 04 Javascript
深入理解jquery跨域请求方法
May 18 Javascript
AngularJS 获取ng-repeat动态生成的ng-model值实例详解
Nov 29 Javascript
使用DeviceOne实现微信小程序功能
Dec 29 Javascript
微信小程序 仿猫眼实现实例代码
Mar 14 Javascript
JS实现简易图片自动轮播
Oct 16 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显示今天、今月、上月、今年的起点/终点时间戳的代码
2011/05/25 PHP
利用php获取服务器时间的实现代码
2013/06/07 PHP
php创建基本身份认证站点的方法详解
2013/06/08 PHP
php出现内存位置访问无效错误问题解决方法
2014/08/16 PHP
php集成环境xampp中apache无法启动问题解决方案
2014/11/18 PHP
php和editplus正则表达式去除空白行
2015/04/17 PHP
php解决和避免form表单重复提交的几种方法
2016/08/31 PHP
使用Git实现Laravel项目的自动化部署
2019/11/24 PHP
JavaScript confirm选择判断
2008/10/18 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
2011/01/15 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
2013/12/13 Javascript
js检测浏览器版本、核心、是否移动端示例
2014/04/24 Javascript
Node.js事件循环(Event Loop)和线程池详解
2015/01/28 Javascript
Javascript数组Array基础介绍
2016/03/13 Javascript
老生常谈遮罩层 滚动条的问题
2016/04/29 Javascript
快速移动鼠标触发问题及解决方法(ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave)
2016/08/29 Javascript
nodejs中sleep功能实现暂停几秒的方法
2017/07/12 NodeJs
微信小程序实现表单校验功能
2020/03/30 Javascript
Vue组件之Tooltip的示例代码
2017/10/18 Javascript
使用命令行工具npm新创建一个vue项目的方法
2017/12/27 Javascript
vue项目中实现图片预览的公用组件功能
2018/10/26 Javascript
微信小程序提交form操作示例
2018/12/30 Javascript
Vue登录拦截 登录后继续跳转指定页面的操作
2020/08/04 Javascript
vant picker+popup 自定义三级联动案例
2020/11/04 Javascript
python批量提交沙箱问题实例
2014/10/08 Python
python flask 多对多表查询功能
2017/06/25 Python
windows下Python实现将pdf文件转化为png格式图片的方法
2017/07/21 Python
python中numpy.zeros(np.zeros)的使用方法
2017/11/07 Python
Python实现FM算法解析
2019/06/18 Python
python接口自动化框架实战
2020/12/23 Python
几道Web/Ajax的面试题
2016/11/05 面试题
房屋转让协议书
2014/04/11 职场文书
补充协议书范本
2014/04/23 职场文书
2014四风问题对照检查材料范文
2014/09/15 职场文书
2014年餐厅服务员工作总结
2014/11/18 职场文书
婚宴祝酒词大全
2015/08/10 职场文书