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 相关文章推荐
XML的代替者----JSON
Jul 21 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 Javascript
JQUERY dialog的用法详细解析
Dec 19 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
Mar 05 Javascript
JavaScript函数柯里化详解
Apr 29 Javascript
js实现多图左右切换功能
Aug 04 Javascript
基于BootStrap实现局部刷新分页实例代码
Aug 08 Javascript
jQuery实现的简单动态添加、删除表格功能示例
Sep 21 jQuery
javaScript 连接打印机,打印小票的实例
Dec 29 Javascript
详解vue-cli项目中的proxyTable跨域问题小结
Feb 09 Javascript
javaScript实现游戏倒计时功能
Nov 17 Javascript
使用vue编写h5公众号跳转小程序的实现代码
Nov 27 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
PHP实现文件安全下载
2006/10/09 PHP
php建立Ftp连接的方法
2015/03/07 PHP
PHP获取数组最大值下标的方法
2015/05/12 PHP
WordPress中获取页面链接和标题的相关PHP函数用法解析
2015/12/17 PHP
利用PHP自动生成印有用户信息的名片
2016/08/01 PHP
php中Redis的应用--消息传递
2017/03/28 PHP
PHP实现git部署的方法教程
2017/12/19 PHP
Laravel框架实现调用百度翻译API功能示例
2019/05/30 PHP
JQuery Tab选项卡效果代码改进版
2010/04/01 Javascript
JS控制网页动态生成任意行列数表格的方法
2015/03/09 Javascript
全面了解addEventListener和on的区别
2016/07/14 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
2017/02/05 Javascript
JS中的三个循环小结
2017/06/20 Javascript
jquery实现倒计时小应用
2017/09/19 jQuery
从setTimeout看js函数执行过程
2017/12/19 Javascript
Vue仿支付宝支付功能
2018/05/25 Javascript
vue修改对象的属性值后页面不重新渲染的实例
2018/08/09 Javascript
微信小程序实现的五星评价功能示例
2019/04/25 Javascript
解决vue+elementui项目打包后样式变化问题
2020/08/03 Javascript
Python实现将数据库一键导出为Excel表格的实例
2016/12/30 Python
python 实现上传图片并预览的3种方法(推荐)
2017/07/14 Python
django框架防止XSS注入的方法分析
2019/06/21 Python
Python树莓派学习笔记之UDP传输视频帧操作详解
2019/11/15 Python
python Matplotlib模块的使用
2020/09/16 Python
python 利用opencv实现图像网络传输
2020/11/12 Python
浅谈matplotlib默认字体设置探索
2021/02/03 Python
html5中的input新属性range使用记录
2014/09/05 HTML / CSS
澳大利亚领先的在线美容商城:Adore Beauty
2017/04/14 全球购物
Sephora丝芙兰泰国官方网站:国际知名化妆品购物
2017/11/15 全球购物
如何让Java程序执行效率更高
2014/06/25 面试题
超市中秋节活动方案
2014/02/12 职场文书
《改造我们的学习》心得体会
2014/11/07 职场文书
2014年科室工作总结
2014/11/20 职场文书
2015年计算机教学工作总结
2015/07/22 职场文书
初中班级口号霸气押韵
2015/12/24 职场文书
初三英语教学反思
2016/02/15 职场文书