JavaScript 如何检测浏览器的版本

本文介绍了在启用JavaScript的网页浏览器中进行浏览器检测的基本理论和技术。

描述： 尽管大多数脚本在启用JavaScript的网页浏览器上工作，但有些事情在某些浏览器上不起作用，即它们依赖于浏览器，在某些情况下旧的网页浏览器不支持某些脚本。
在某些情况下，了解客户端的网页浏览器以适当地提供某些内容或信息变得非常重要。基本上，它允许您了解客户端的网页浏览器版本和名称，并且在此处我们需要为不同的浏览器编写不同的函数以进行检测。

浏览器检测： 主要有两个对象用于浏览器检测，它们如下：

navigator.appName
navigator.appVersion

第一个对象用于确定网页浏览器，而第二个对象用于确定网页浏览器的版本。

例如，如果浏览器是Mozilla Firefox，navigator.appName返回字符串“Mozilla Firefox”。如果是Edge浏览器，navigator.appName返回字符串“Microsoft Edge”。使用这两个对象，我们可以创建一个警告框来显示客户端使用的是哪种网页浏览器，而此navigator对象包含有关网页浏览器版本、名称和更多信息的所有内容。

示例： 此示例显示了上述方法的使用。

<script Language="JavaScript"> 
    var objappVersion = navigator.appVersion; 
    var browserAgent = navigator.userAgent; 
    var browserName = navigator.appName; 
    var browserVersion = '' + parseFloat(navigator.appVersion); 
    var browserMajorVersion = parseInt(navigator.appVersion, 10); 
    var Offset, OffsetVersion, ix; 
      
    // For Chrome  
    if ((OffsetVersion = browserAgent.indexOf("Chrome")) != -1) { 
        browserName = "Chrome"; 
        browserVersion = browserAgent.substring(OffsetVersion + 7); 
    } 
      
    // For Microsoft internet explorer  
    else if ((OffsetVersion = browserAgent.indexOf("MSIE")) != -1) { 
        browserName = "Microsoft Internet Explorer"; 
        browserVersion = browserAgent.substring(OffsetVersion + 5); 
    } 
      
    // For Firefox 
    else if ((OffsetVersion = browserAgent.indexOf("Firefox")) != -1) { 
        browserName = "Firefox"; 
    } 
      
    // For Safari 
    else if ((OffsetVersion = browserAgent.indexOf("Safari")) != -1) { 
        browserName = "Safari"; 
        browserVersion = browserAgent.substring(OffsetVersion + 7); 
        if ((OffsetVersion = browserAgent.indexOf("Version")) != -1) 
            browserVersion = browserAgent.substring(OffsetVersion + 8); 
    } 
      
    // For other browser "name/version" is at the end of userAgent  
    else if ((Offset = browserAgent.lastIndexOf(' ') + 1) < 
        (OffsetVersion = browserAgent.lastIndexOf('/'))) { 
        browserName = browserAgent.substring(Offset, OffsetVersion); 
        browserVersion = browserAgent.substring(OffsetVersion + 1); 
        if (browserName.toLowerCase() == browserName.toUpperCase()) { 
            browserName = navigator.appName; 
        } 
    } 
      
    // Trimming the fullVersion string at  
    // semicolon/space if present  
    if ((ix = browserVersion.indexOf(";")) != -1) 
        browserVersion = browserVersion.substring(0, ix); 
    if ((ix = browserVersion.indexOf(" ")) != -1) 
        browserVersion = browserVersion.substring(0, ix); 
      
      
    browserMajorVersion = parseInt('' + browserVersion, 10); 
    if (isNaN(browserMajorVersion)) { 
        browserVersion = '' + parseFloat(navigator.appVersion); 
        browserMajorVersion = parseInt(navigator.appVersion, 10); 
    } 
    document.write(''
        + 'Name of Browser = ' + browserName + '<br>'
        + 'Full version = ' + browserVersion + '<br>'
        + 'Major version = ' + browserMajorVersion + '<br>'
        + 'navigator.appName = ' + navigator.appName + '<br>'
        + 'navigator.userAgent = ' + navigator.userAgent + '<br>'
    ); 
</script>

输出：

下面的输出表示对“Chrome”进行浏览器检测的输出结果

Name of Browser = Chrome 
Full version = 86.0.4240.183 
Major version = 86 
navigator.appName = Netscape 
navigator.userAgent = Mozilla/5.0 (Windows NT 10.0; Win64; x64) 
                      AppleWebKit/537.36 (KHTML, like Gecko) 
                      Chrome/86.0.4240.183 
Safari/537.36

下面的输出表示对“Mozilla Firefox”进行浏览器检测的输出

Name of Browser = Firefox 
Full version = 5 
Major version = 5 
navigator.appName = Netscape 
navigator.userAgent = Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:80.0) 
                      Gecko/20100101 
Firefox/80.0

结论： 本文从浏览器检测理论开始讲解，然后解释了浏览器检测方案和检测脚本。在当前环境下，这非常有益，因为所有浏览器都支持此应用程序。所以，检测/找到浏览器，然后编写相应的代码。