首页 web前端 js教程 JS判断浏览器类型及版本实例详解

JS判断浏览器类型及版本实例详解

Jun 28, 2017 pm 02:48 PM
firefox ie javascript webkit 判断 框架 浏览器

[javascript] view plain copy

今天用到JS判断浏览器类型,于是就系统整理了一下,便于后期使用。  

[javascript] view plain copy

  /* 

   * 描述:判断浏览器信息 

   * 编写:LittleQiang_w 

   * 日期:2016.1.5 

   * 版本:V1.1 

   */  

  

  //判断当前浏览类型  

  function BrowserType()  

  {  

      var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串  

      var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器  

      var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器  

      var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判断是否IE的Edge浏览器  

      var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器  

      var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1; //判断是否Safari浏览器  

      var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1; //判断Chrome浏览器  

  

      if (isIE)   

      {  

           var reIE = new RegExp("MSIE (\\d+\\.\\d+);");  

           reIE.test(userAgent);  

           var fIEVersion = parseFloat(RegExp["$1"]);  

           if(fIEVersion == 7)  

           { return "IE7";}  

           else if(fIEVersion == 8)  

           { return "IE8";}  

           else if(fIEVersion == 9)  

           { return "IE9";}  

           else if(fIEVersion == 10)  

           { return "IE10";}  

           else if(fIEVersion == 11)  

           { return "IE11";}  

           else  

           { return "0"}//IE版本过低  

       }//isIE end  

         

       if (isFF) {  return "FF";}  

       if (isOpera) {  return "Opera";}  

       if (isSafari) {  return "Safari";}  

       if (isChrome) { return "Chrome";}  

       if (isEdge) { return "Edge";}  

   }//myBrowser() end  

     

   //判断是否是IE浏览器  

   function isIE()  

   {  

      var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串  

      var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器  

      if(isIE)  

      {  

          return "1";  

      }  

      else  

      {  

          return "-1";  

      }  

   }  

     

     

   //判断是否是IE浏览器,包括Edge浏览器  

   function IEVersion()  

   {  

      var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串  

      var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器  

var isEdge = userAgent.indexOf("Windows NT 6.1; Trident/7.0;") > -1 && !isIE; //判断是否IE的Edge浏览器  

      if(isIE)  

      {  

           var reIE = new RegExp("MSIE (\\d+\\.\\d+);");  

           reIE.test(userAgent);  

           var fIEVersion = parseFloat(RegExp["$1"]);  

           if(fIEVersion == 7)  

           { return "IE7";}  

           else if(fIEVersion == 8)  

           { return "IE8";}  

           else if(fIEVersion == 9)  

           { return "IE9";}  

           else if(fIEVersion == 10)  

           { return "IE10";}  

           else if(fIEVersion == 11)  

           { return "IE11";}  

           else  

           { return "0"}//IE版本过低  

      }  

else if(isEdge)  

{  

    return "Edge";  

}  

      else  

      {  

          return "-1";//非IE  

      }  

   }  

以上代码通过测试,可用!

        但存在一个问题,即IE5与IE7浏览器暂不能区分,以下是IE5与IE7下userAgent的信息;通过userAgent发现,简单的通过以上方法,无法正确区分IE5和IE7。期待该问题的解决方案!!!

     IE5: userAgent   "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; .NET4.0E)"

     IE7: userAgent  "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; .NET4.0E)"

以上是JS判断浏览器类型及版本实例详解的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何通过CSS自定义resize符号并使其与背景色统一? 如何通过CSS自定义resize符号并使其与背景色统一? Apr 05, 2025 pm 02:30 PM

CSS自定义resize符号的方法与背景色统一在日常开发中,我们经常会遇到需要自定义用户界面细节的情况,比如调...

如何在网页上正确显示本地安装的'荆南麦圆体”? 如何在网页上正确显示本地安装的'荆南麦圆体”? Apr 05, 2025 pm 10:33 PM

在网页中使用本地安装的字体文件最近,我从网上下载了一种免费字体,并成功将其安装到了我的系统中。现在...

如何在渐变背景的卡券布局上实现缺口效果? 如何在渐变背景的卡券布局上实现缺口效果? Apr 05, 2025 am 07:48 AM

实现卡券布局的缺口效果在设计卡券布局时,常常会遇到需要在卡券上添加缺口的需求,尤其是在背景为渐变色...

Flex布局下文字超出省略却撑开容器?如何解决? Flex布局下文字超出省略却撑开容器?如何解决? Apr 05, 2025 pm 11:00 PM

Flex布局下文字超出省略导致容器撑开的问题及解决方法在使用Flex...

负边距在某些情况下为何未生效?如何解决这个问题? 负边距在某些情况下为何未生效?如何解决这个问题? Apr 05, 2025 pm 10:18 PM

负边距为何在某些情况下未生效?在编程过程中,CSS中的负边距(negative...

如何获取58同城工作页面上的实时申请和浏览人数数据? 如何获取58同城工作页面上的实时申请和浏览人数数据? Apr 05, 2025 am 08:06 AM

如何在爬虫时获取58同城工作页面的动态数据?在使用爬虫工具爬取58同城的某个工作页面时,可能会遇到这样�...

为什么Edge浏览器中的特定div元素无法显示?如何解决这个问题? 为什么Edge浏览器中的特定div元素无法显示?如何解决这个问题? Apr 05, 2025 pm 08:21 PM

如何解决用户代理样式表导致的显示问题?在使用Edge浏览器时,项目中的一个div元素无法显示。经过查看,发�...

如何使用 CSS 和 Flexbox 实现图片和文本在不同屏幕尺寸下的响应式布局? 如何使用 CSS 和 Flexbox 实现图片和文本在不同屏幕尺寸下的响应式布局? Apr 05, 2025 pm 06:06 PM

使用CSS实现响应式布局当我们希望在网页设计中实现不同屏幕尺寸下的布局变化时,CSS...

See all articles