zoukankan      html  css  js  c++  java
  • JS 浏览器检测

    原创博文,转载请注明出处

    如果你现在还是一个JavaScript新手(比如本人,哈哈 ),由于浏览器的兼容问题,很容易写出不兼容的JS代码,这就需要我们对浏览器进行检测。

    JavaScript Navigator 对象包含了有关访问者浏览器的所有信息。

    Navigator含有以下几个属性: 

            浏览器信息:

             浏览器代码名称:navigator.appCodeName

              浏览器名称:navigator.appName

              浏览器版本号:navigator.appVersion,包括了大版本号、小版本号、语言、操作平台等信息。

              浏览器次要版本:navigator.appMinorVersion

              MIME类型(数组):navigator.mimeTypes

              系统平台:navigator.platform

              插件(数组):navigator.plugins

              用户代理:navigator.userAgent  

             cpu信息: navigator.cpuClass

              语言: navigator.language,还有userLanguage操作系统设定的自然语言,browserLanguage返回浏览器当前语言, systemLanguage返回当前操作系统的缺省语言。

            浏览器状态:

                   cookie开启关闭:navigator.cookieEnabled

                   浏览器联网状态:navigator.online

                  对Java的支持:navigator.javaEnabled()

           其他:

                  用户信息:navigator.userProfile,拥有 addReadRequest() doReadRequest() getAttribute() clearRequest() 等方法。

                 指定是否允许数据污点:navigator.taintEnabled 是否可以加密数据的真伪值。仅IE有效。在navigator 4.0 已删除

     我们来看一个例子:这个例子用来返回当前浏览器的信息。

     1 <html>
     2 <body>
     3 
     4 <script type="text/javascript">
     5 var x = navigator;
     6 document.write("CodeName=" + x.appCodeName);
     7 document.write("<br />");
     8 document.write("MinorVersion=" + x.appMinorVersion);
     9 document.write("<br />");
    10 document.write("Name=" + x.appName);
    11 document.write("<br />");
    12 document.write("Version=" + x.appVersion);
    13 document.write("<br />");
    14 document.write("CookieEnabled=" + x.cookieEnabled);
    15 document.write("<br />");
    16 document.write("CPUClass=" + x.cpuClass);
    17 document.write("<br />");
    18 document.write("OnLine=" + x.onLine);
    19 document.write("<br />");
    20 document.write("Platform=" + x.platform);
    21 document.write("<br />");
    22 document.write("UA=" + x.userAgent);
    23 document.write("<br />");
    24 document.write("userProfile="+x.userProfile)
    25 document.write("<br />");
    26 document.write("Language="+x.language)
    27 document.write("<br />");
    28 document.write("BrowserLanguage=" + x.browserLanguage);
    29 document.write("<br />");
    30 document.write("SystemLanguage=" + x.systemLanguage);
    31 document.write("<br />");
    32 document.write("UserLanguage=" + x.userLanguage);
    33 </script>
    34 
    35 </body>

    如果返回了“undefined” (比如,browserLanguage,cpuClass,onLine等属性)是因为你的当前浏览器使用的是Firefox或者chrome,当你切换到IE之后就会发现其中变化了。

    下面的例子是返回你的IE浏览器的版本信息:        

     1 <html>
     2 <body>
     3 <script>
     4 //获取IE浏览器的版本号
     5 //返回数值,显示IE的主版本号
     6 function getIEVer() {
     7  var ua = navigator.userAgent; //获取用户端信息
     8  var b = ua.indexOf("MSIE "); //检测特殊字符串"MSIE "的位置
     9  if (b < 0) {
    10   return 0;
    11  }
    12  return parseFloat(ua.substring(b + 5, ua.indexOf(";", b))); //截取版本号字符串,并转换为数值
    13 }
    14 alert(getIEVer()); //返回数值8(我的IE8)
    15 </script>
    16 </body>
    17 </html>

    像在我的IE浏览器中,userAgent返回如下信息:UA=Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; MSIE就代表了浏览器的版本,TridentIE排版引擎的名称。

    下面的例子可以用来判断当前浏览器的版本。

     1 <html>
     2 <head>
     3     <title>JavaScript检测浏览器</title>
     4 </head>
     5 <body>
     6 <script type="text/javascript">
     7     var userAgent=navigator.userAgent.toLowerCase(), s, o = {};   
     8     var browser={
     9         version:(userAgent.match(/(?:firefox|opera|safari|chrome|msie)[/: ]([d.]+)/))[1],
    10         safari:/version.+safari/.test(userAgent),
    11         chrome:/chrome/.test(userAgent),
    12         firefox:/firefox/.test(userAgent),
    13         ie:/msie/.test(userAgent),
    14         opera: /opera/.test(userAgent ) 
    15     } /* 获得浏览器的名称及版本信息 */
    16 
    17     if (browser.ie && browser.version > 6)
    18     {
    19       /* 判断是否为IE 6以上版本,是则执行以下操作 */
    20       document.writeln("<p>您使用的是IE "+browser.version+"</p>");
    21     }
    22    if (browser.safari) {
    23       doucment.writeln("<p>您使用的是safari浏览器</p>");
    24     }  /* 判断是否为safari */
    25    if (browser.firefox) {
    26       document.writeln("<p>您使用的是firefox浏览器</p>");
    27     } /* 判断是否为firefox */
    28    if (browser.chrome) {
    29      document.writeln("<p>您使用的是chrome浏览器</p>");
    30     }  /* 判断是否为chrome */
    31    if (browser.opera) {
    32      document.writeln("<p>您使用的是opera浏览器</p>");
    33     }   /* 判断是否为opera */
    34 </script>
    35 </body>
    36 </html>

     ps:博文发出去后有园友建议用检测功能来代替Agent,由于刚接触javascript而且并不以此为主要工作,所以对我而言用处不大,如果你是做前端工作的,建议你学习使用Modernizr检查功能,我简单的看了一下介绍,感觉是个强大的东西。

    参照:javaScript语言参考手册

  • 相关阅读:
    FlexBuilder2组件学习之Tree组件
    ASP.Net数据验证中的验证组
    私のスピーチ
    ASP调用ORACLE的存储过程
    将Excel数据导入到Sql Server "当IDENTITY_INSERT设置为OFF时" 的解决
    Android中如何使用命令行查看内嵌数据库SQLite3
    20110406新工作的开始
    (转)如何在Eclipse中查看JDK类库的源代码
    Sql Server存储过程中加入Try Catch,并向客户端返回友好信息
    解决 Access 磁盘空间或内存不足一例
  • 原文地址:https://www.cnblogs.com/tracylining/p/3373662.html
Copyright © 2011-2022 走看看