JavaScript 中的浏览器检测？ [复制]

Posted 2023-03-14

技术标签:

【中文标题】JavaScript 中的浏览器检测？ [复制]【英文标题】：Browser detection in JavaScript? [duplicate] 【发布时间】：2011-01-24 22:46:16 【问题描述】：

如何使用 javascript 确定确切的浏览器和版本？

【问题讨论】：

确保您没有将关键功能基于此测试。 +1：好问题，因为建议检测功能支持而不是提取答案中的名称和版本。这里有一个更好的解释对象检测的链接：quirksmode.org/js/support.html 更多相关答案可在this 和this dupe 上找到 【参考方案1】：

var browser = navigator.appName;
var version = navigator.appVersion;

但是请注意，两者都不一定反映事实。许多浏览器可以设置为屏蔽为其他浏览器。因此，例如，您无法始终确定用户是使用 IE6 还是使用伪装成 IE6 的 Opera 进行冲浪。

【讨论】：

+1：与之前的downvote相反，理论上，这是正确的方式；实际上，浏览器供应商用有问题的内容填充这些值；请参阅 MDC (developer.mozilla.org/En/DOM/Window.navigator) 和 MSDN (msdn.microsoft.com/en-us/library/ms535867%28VS.85%29.aspx) 上的文档；谷歌也把我带到了下面的页面（过时了，还没有 Chrome），这表明它主要是 Safari 报告垃圾：javascriptkit.com/jsref/navigator.shtml 理论上这甚至不是正确的方法 - 请参阅 HTML5 规范第 6.5.1.1 节客户端标识，其中提到 navigator.appName：必须返回字符串“Netscape”或全名浏览器，例如“Mellblom 浏览器”。换句话说，HTML5 标准甚至不假装要求 appName 具有有意义的值。 @Spike0xff 这个答案来自一个完全没有人使用 HTML5 的时代，或者确实没有人听说过它。 @ЯegDwight（或者我应该说 Elton？）：navigator.appName 一直是 "Netscape" 或者几乎所有浏览器上都没有，早在 HTML5 规范编纂这种做法之前。 php 使用可选的 browsercap.ini 来做到这一点。你可以下载？全部？可能来自 browscap.org 的用户代理字符串。你会发现它非常复杂。此外，所有以 HTTP_ 开头的标头都可能是伪造的。【参考方案2】：

通常最好尽可能避免使用特定于浏览器的代码。 JQuery $.support 属性可用于检测对特定功能的支持，而不是依赖于浏览器名称和版本。

例如，在 Opera 中，您可以伪造 Internet Explorer 或 firefox 实例。

JQuery.support 的详细描述可以在这里找到：http://api.jquery.com/jQuery.support/

现在根据 jQuery 已弃用。

我们强烈建议使用外部库，例如 Modernizr 而不是依赖jQuery.support中的属性。

在编写网站代码时，我总是确保非 js 用户也可以使用导航等基本功能。这可能是讨论的对象，如果主页针对特殊受众，则可以忽略。

【讨论】：

有时您确实需要了解浏览器，因为相同的功能以不同的方式支持。因此，如果使用 jQuery，$.browser 是正确的方法，如 user288744 所示有时您确实需要知道浏览器版本。请务必回答所提出的问题。 @PhilRykoff - 但你没有回答问题的 99% 情况 - 你正在回答另一个问题的 99% 情况，你认为提问者打算问或应该问.也许先要求澄清？ @Phil，你是对的，有时最好的答案是提问者甚至没有问过的答案。但是，我不同意您将该理论应用于这个问题。考虑window.onpopstate（请记住，对于从未提及jQuery 的问题，非jQuery 答案是最理想的）——与其他浏览器相比，IE 不会在初始视图中触发它。有时，为了稳健，您必须考虑您正在处理的浏览器以正确实现功能。鉴于这个问题的标题，这正是人们所期望的信息，而你却没有。呃，我不想这么说，但是除了为了兼容性目的在多个浏览器上测试你的代码之外，你还会欺骗浏览器的配置吗？【参考方案3】：

这个little library 可以帮助你。但请注意，浏览器检测并不总是解决方案。

【讨论】：

那么，解决办法是什么？您如何制作取决于浏览器或其版本的样式/功能？【参考方案4】：

这是我为了获取客户信息而写的东西

var ua = navigator.userAgent.toLowerCase();
var check = function(r) 
    return r.test(ua);
;
var DOC = document;
var isStrict = DOC.compatMode == "CSS1Compat";
var isOpera = check(/opera/);
var isChrome = check(/chrome/);
var isWebKit = check(/webkit/);
var isSafari = !isChrome && check(/safari/);
var isSafari2 = isSafari && check(/applewebkit\/4/); // unique to
// Safari 2
var isSafari3 = isSafari && check(/version\/3/);
var isSafari4 = isSafari && check(/version\/4/);
var isIE = !isOpera && check(/msie/);
var isIE7 = isIE && check(/msie 7/);
var isIE8 = isIE && check(/msie 8/);
var isIE6 = isIE && !isIE7 && !isIE8;
var isGecko = !isWebKit && check(/gecko/);
var isGecko2 = isGecko && check(/rv:1\.8/);
var isGecko3 = isGecko && check(/rv:1\.9/);
var isBorderBox = isIE && !isStrict;
var isWindows = check(/windows|win32/);
var isMac = check(/macintosh|mac os x/);
var isAir = check(/adobeair/);
var isLinux = check(/linux/);
var isSecure = /^https/i.test(window.location.protocol);
var isIE7InIE8 = isIE7 && DOC.documentMode == 7;

var jsType = '', browserType = '', browserVersion = '', osName = '';
var ua = navigator.userAgent.toLowerCase();
var check = function(r) 
    return r.test(ua);
;

if(isWindows)
    osName = 'Windows';

    if(check(/windows nt/))
        var start = ua.indexOf('windows nt');
        var end = ua.indexOf(';', start);
        osName = ua.substring(start, end);
    
 else 
    osName = isMac ? 'Mac' : isLinux ? 'Linux' : 'Other';
 

if(isIE)
    browserType = 'IE';
    jsType = 'IE';

    var versionStart = ua.indexOf('msie') + 5;
    var versionEnd = ua.indexOf(';', versionStart);
    browserVersion = ua.substring(versionStart, versionEnd);

    jsType = isIE6 ? 'IE6' : isIE7 ? 'IE7' : isIE8 ? 'IE8' : 'IE';
 else if (isGecko)
    var isFF =  check(/firefox/);
    browserType = isFF ? 'Firefox' : 'Others';;
    jsType = isGecko2 ? 'Gecko2' : isGecko3 ? 'Gecko3' : 'Gecko';

    if(isFF)
        var versionStart = ua.indexOf('firefox') + 8;
        var versionEnd = ua.indexOf(' ', versionStart);
        if(versionEnd == -1)
            versionEnd = ua.length;
        
        browserVersion = ua.substring(versionStart, versionEnd);
    
 else if(isChrome)
    browserType = 'Chrome';
    jsType = isWebKit ? 'Web Kit' : 'Other';

    var versionStart = ua.indexOf('chrome') + 7;
    var versionEnd = ua.indexOf(' ', versionStart);
    browserVersion = ua.substring(versionStart, versionEnd);
else
    browserType = isOpera ? 'Opera' : isSafari ? 'Safari' : '';

【讨论】：

总是运行所有检查不是有点浪费吗？如果您知道它是 Windows，那么检查 Linux 似乎毫无意义不是吗... @Matthias，感谢您的建议。我将尝试优化解决方案。同样的逻辑也可以应用于浏览器的测试。你的答案是任何人都能给出的最佳答案..thx.让我的生活更轻松 @ArunPJohny：+1，对于那些你别无选择只能浏览器检测而不是功能检测的可怕、罕见的情况。您是否保持最新状态，也许在某个操作系统项目中？显然，自从你写了这个答案之后，IE 就不再说 MSIE 了…… 我看到的都是var var var var var var ... 请以后看到这个的程序员不要这样做。这真的没有必要，而且对于患有强迫症的项目经理来说阅读起来很痛苦。【参考方案5】：

您可以使用 jQuery 库来检测浏览器版本。

示例：

jQuery.browser.version

但是，这只有在您还使用 jQuery 的其他功能时才有意义。添加整个库只是为了检测浏览器对我来说似乎有点矫枉过正。

更多信息： http://api.jquery.com/jQuery.browser/

（你必须向下滚动一点）

【讨论】：

我刚刚尝试过 win 8 chrome 25 和 ie 10。好吧，它完全失败了。 3 年后，任何当前的支持都会很好。这个特性在 jQuery 1.3 中被弃用，最终在 jQuery 1.9 中被移除。所以，最好不要依赖它。【参考方案6】：

不完全是你想要的，但接近它：

var jscriptVersion = /*@cc_on @if(@_jscript) @_jscript_version @else @*/ false /*@end @*/;
var geckoVersion = navigator.product === 'Gecko' && navigator.productSub;
var operaVersion = 'opera' in window && 'version' in opera && opera.version();

变量将包含适当的版本或false（如果不可用）。

如果有人使用 Chrome 可以了解您是否可以像使用 window.opera 一样使用 window.chrome，我将不胜感激。

【讨论】：

【参考方案7】：

navigator.saysWho = (() => 
  const  userAgent  = navigator
  let match = userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []
  let temp

  if (/trident/i.test(match[1])) 
    temp = /\brv[ :]+(\d+)/g.exec(userAgent) || []

    return `IE $temp[1] || ''`
  

  if (match[1] === 'Chrome') 
    temp = userAgent.match(/\b(OPR|Edge)\/(\d+)/)

    if (temp !== null) 
      return temp.slice(1).join(' ').replace('OPR', 'Opera')
    

    temp = userAgent.match(/\b(Edg)\/(\d+)/)

    if (temp !== null) 
      return temp.slice(1).join(' ').replace('Edg', 'Edge (Chromium)')
    
  

  match = match[2] ? [ match[1], match[2] ] : [ navigator.appName, navigator.appVersion, '-?' ]
  temp = userAgent.match(/version\/(\d+)/i)

  if (temp !== null) 
    match.splice(1, 1, temp[1])
  

  return match.join(' ')
)()

console.log(navigator.saysWho) // outputs: `Chrome 89`

顾名思义，这将告诉您浏览器提供的名称和版本号。

当您在多个浏览器上测试新代码时，它可以方便地对测试和错误结果进行排序。

【讨论】：

+1 来自我。有时，这与功能支持无关，实际上与浏览器有关。是的，用户代理信息可以被欺骗，但是当您处理旧浏览器并规避它们的错误时（例如 FF 3 的问题，即不为只读 AJAX POST 消息发送 Content-Length 标头），功能支持只是不别剪了。很高兴知道这个函数返回的所有结果...... 我喜欢这个！谢啦！不过，我只是对倒数第一行和第二行进行了修改。我在第一行替换了：navigator.sayswho= 与 navigator.browserInfo= 以获得更好的可读性（即，几个月后我不会想知道它在代码中的作用）并将 return M.join(' '); 替换为 return 'browser': M[0], 'version': M[1] ; 以便我可以像使用它一样this 在全球范围内：console.log(navigator.browserInfo.browser); 和 console.log(navigator.browserInfo.version); 以获得更好的可访问性。对不起，我想我确实弄乱了它，即使它说“不要碰”。暂时仅在 chrome 上测试...如果您希望获得完整版本号，请将 regx 更改为 (vivaldi|opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*([0-9|\.]+) 区别是最后一个括号而不是 (d+) 它应该是 @987654330 @so 数字和点。还添加了 vivaldi 浏览器以防万一:) 这段代码很难读。 tem 是什么？ M 是什么？【参考方案8】：

关于网络浏览器的所有信息都包含在 navigator 对象中。名称和版本在那里。

var appname = window.navigator.appName;

来源：javascript browser detection

【讨论】：

Chrome 显示“网景” Firefox 20.0.1 在 XP 上也显示“Netscape”。 Firefox 和 Chrome 说“网景”。 IE 8 什么也没说！尝试应用代号w3schools.com/jsref/prop_nav_appcodename.asp appCodeName = Mozilla 和 appName = chrome 33 中的 Netscape【参考方案9】：

//Copy and paste this into your code/text editor, and try it

//Before you use this to fix compatability bugs, it's best to try inform the browser provider that you have found a bug and there latest browser may not be up to date with the current web standards

//Since none of the browsers use the browser identification system properly you need to do something a bit like this

//Write browser identification
document.write(navigator.userAgent + "<br>")

//Detect browser and write the corresponding name
if (navigator.userAgent.search("MSIE") >= 0)
    document.write('"MS Internet Explorer ');
    var position = navigator.userAgent.search("MSIE") + 5;
    var end = navigator.userAgent.search("; Windows");
    var version = navigator.userAgent.substring(position,end);
    document.write(version + '"');

else if (navigator.userAgent.search("Chrome") >= 0)
document.write('"Google Chrome ');// For some reason in the browser identification Chrome contains the word "Safari" so when detecting for Safari you need to include Not Chrome
    var position = navigator.userAgent.search("Chrome") + 7;
    var end = navigator.userAgent.search(" Safari");
    var version = navigator.userAgent.substring(position,end);
    document.write(version + '"');

else if (navigator.userAgent.search("Firefox") >= 0)
    document.write('"Mozilla Firefox ');
    var position = navigator.userAgent.search("Firefox") + 8;
    var version = navigator.userAgent.substring(position);
    document.write(version + '"');

else if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0)//<< Here
    document.write('"Apple Safari ');
    var position = navigator.userAgent.search("Version") + 8;
    var end = navigator.userAgent.search(" Safari");
    var version = navigator.userAgent.substring(position,end);
    document.write(version + '"');

else if (navigator.userAgent.search("Opera") >= 0)
    document.write('"Opera ');
    var position = navigator.userAgent.search("Version") + 8;
    var version = navigator.userAgent.substring(position);
    document.write(version + '"');

else
    document.write('"Other"');


//Use w3schools research the `search()` method as other methods are availible

【讨论】：

请不要推荐w3schools 而且，就像其他十亿这样的代码 sn-ps 一样，这在 IE 11（以及可能的更高版本）上失败了。 Chrome 中的“未定义”。【参考方案10】：

我建议使用小型 JavaScript 库 Bowser。它基于navigator.userAgent，并针对包括 iphone、android 等在内的所有浏览器进行了很好的测试。

https://github.com/ded/bowser

你可以简单地说：

if (bowser.msie && bowser.version <= 6) 
  alert('Hello IE');
 else if (bowser.firefox)
  alert('Hello Foxy');
 else if (bowser.chrome)
  alert('Hello Chrome');
 else if (bowser.safari)
  alert('Hello Safari');
 else if(bowser.iphone || bowser.android)
  alert('Hello mobile');

【讨论】：

【参考方案11】：

这会告诉您有关浏览器及其版本的所有详细信息。

<!DOCTYPE html>
<html>
<body>
<div id="example"></div>

<script>

txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";

document.getElementById("example").innerHTML=txt;

</script>

</body>
</html>

【讨论】：

所有平台都支持吗？在 firefox、IE 和 chrome 中检查....在那里工作....请让我知道您的反馈看起来我所有的浏览器都是 Netscape。要么你的代码很烂，要么我很高 “在我的机器上工作”是不可接受的 Web 开发方法。这些方法已弃用，不应使用。【参考方案12】：

 var isOpera = !!window.opera || navigator.userAgent.indexOf('Opera') >= 0;
        // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
        var isFirefox = typeof InstallTrigger !== 'undefined';   // Firefox 1.0+
        var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
        // At least Safari 3+: "[object HTMLElementConstructor]"
        var isChrome = !!window.chrome;                          // Chrome 1+
        var isIE = /*@cc_on!@*/false;

你可以阅读更多 How to detect Safari, Chrome, IE, Firefox and Opera browser?

【讨论】：

【参考方案13】：

遗憾的是，IE11 的navigator.userAgent 中不再包含MSIE：

Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; OfficeLiveConnector.1.5; OfficeLivePatch.1.3; .NET4.0C; BRI/2; BOIE9;ENUS; rv:11.0) like Gecko

至于为什么你想知道你正在使用哪个浏览器，这是因为每个浏览器都有自己的一组错误，你最终会实现浏览器和版本特定的解决方法，或者告诉用户使用不同的浏览器！

【讨论】：

这就是人们使用它的目的。如果他们知道他们将不支持 IE 检测它并让他们知道。【参考方案14】：

我发现了一些有趣且更快的方法。 IE 支持navigator.systemLanguage，它返回“en-US”，而其他浏览器返回undefined。

<script>
    var lang = navigator.systemLanguage;
    if (lang!='en-US')document.write("Well, this is not internet explorer");
    elsedocument.write("This is internet explorer");
</script>

【讨论】：

【参考方案15】：

这是我为 Internet Explorer 自定义 CSS 的方法：

在我的 JavaScript 文件中：

function isIE () 
      var myNav = navigator.userAgent.toLowerCase();
      return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;


jQuery(document).ready(function()
    if(var_isIE)
            if(var_isIE == 10)
                jQuery("html").addClass("ie10");
            
            if(var_isIE == 8)
                jQuery("html").addClass("ie8");
                // you can also call here some function to disable things that 
                //are not supported in IE, or override browser default styles.
            
        
    );

然后在我的 CSS 文件中，定义每种不同的样式：

.ie10 .some-class span
    .......

.ie8 .some-class span
    .......

【讨论】：

【参考方案16】：

如果你想要一个返回浏览器和版本的函数，这里是对原始答案的改进：

navigator.browserInfo = 
(
    function()
    
        var browser = '';
        var version = '';
        var idString = '';

        var ua = navigator.userAgent;
        var tem = [];
        var M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i);

        //IE will be identified as 'Trident' and a different version number. The name must be corrected to 'Internet Explorer' and the correct version identified.
        //ie correction
        if(/trident/i.test(M[1]))
        
            tem = /\brv[ :]+(\d+.?\d*)/g.exec(ua) || [];
            browser = 'Internet Explorer';
            version = tem[1];
        

        //firefox
        else if(/firefox/i.test(M[1]))
        
            tem = /\brv[ :]+(\d+.?\d*)/g.exec(ua) || [];
            browser = 'Firefox';
            version = tem[1];
        

        //safari
        else if(/safari/i.test(M[1]))
        
            tem = ua.match(/\bVersion\/(\d+.?\d*\s*\w+)/);
            browser = 'Safari';
            version = tem[1];
        

        //If 'Chrome' is found, it may be another browser. 
        else if(M[1] === 'Chrome')
        
            //opera
            var temOpr = ua.match(/\b(OPR)\/(\d+.?\d*.?\d*.?\d*)/);
            //edge
            var temEdge = ua.match(/\b(Edge)\/(\d+.?\d*)/);
            //chrome
            var temChrome = ua.match(/\b(Chrome)\/(\d+.?\d*.?\d*.?\d*)/);

            //a genuine 'Chrome' reading will result from ONLY temChrome not being null.
            var genuineChrome = temOpr == null && temEdge == null && temChrome != null;

            if(temOpr != null)
            
                browser = temOpr[1].replace('OPR', 'Opera');
                version = temOpr[2];
            

            if(temEdge != null)
            
                browser = temEdge[1];
                version = temEdge[2];
            

            if(genuineChrome)
            
                browser = temChrome[1];
                version = temChrome[2];
            
        
        //There will be some odd balls, so if you wish to support those browsers, add functionality to display those browsers as well.

        if(browser == '' || version == '')
        
            idString = 'We couldn\'t find your browser, but you can still use the site';
        
        else
        
            idString = browser + ' version ' + version;
        

        alert('Your browser is ' + idString);

        //store the type of browser locally
        if(typeof(Storage) !== "undefined")
        
            //Store
            localStorage.setItem('browser', browser);
            localStorage.setItem('version', version);
         
        else
        
            alert('local storage not available');
        
    
)();

这样，它也将结果存储在本地，因此不必每次都运行此检查。

【讨论】：

这几乎是已接受答案的精确副本。请注意，@kennebec 的解决方案返回浏览器名称和版本，而此版本仅返回浏览器名称。【参考方案17】：

有时我们需要简单的方法来检查浏览器是否为 IE。可能是这样的：

 var isMSIE = (/trident/i).test(navigator.userAgent);

 if(isMSIE)
 
  /* do something for ie */
 
 else
 
  /* do something else */

或简化的 siva 方法：

 if(!!navigator.systemLanguage)
 
  /* do something for ie */
 
 else
 
  /* do something else */

MSIE v.11 检查：

if( (/trident/i).test(navigator.userAgent) && (/rv:/i).test(navigator.userAgent) )

  /* do something for ie 11 */

其他 IE 浏览器的 userAgent 属性中包含 MSIE 字符串，可以被它捕获。

【讨论】：

根据这个问题的许多其他答案，进行特征检测比浏览器检测要好得多。检测 IE 浏览器的其他方法，包括用户代理中的功能和字符串检测。 if( (/MSIE/i).test(navigator.userAgent) && !!window.MSInputMethodContext ) /* ie check */ 或 if( !!window.MSInputMethodContext ) /* ie 11 check */ 【参考方案18】：

自从 Internet Explorer 11 (IE11+) 出现并且不再使用 MSIE 的标签名称后，我想出了一个旧检测功能的变体：

navigator.sayswho= (function()
    var N= navigator.appName, ua= navigator.userAgent, tem;

    // if IE11+
    if (new RegExp("Trident/.*rv:([0-9]1,[\.0-9]0,)").exec(ua) !== null) 
        var M= ["Internet Explorer"];
        if(M && (tem= ua.match(/rv:([0-9]1,[\.0-9]0,)/))!= null) M[2]= tem[1];
        M= M? [M[0], M[2]]: [N, navigator.appVersion,'-?'];
        return M;
    

    var M= ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);
    if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) M[2]= tem[1];
    M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
    return M;
)();

【讨论】：

【参考方案19】：

我知道我回答这个问题已经很晚了，但我想我会把我的 sn-ps 扔在这里。这里的很多答案都可以，而且，正如有人指出的那样，通常最好使用feature detection 而不是依赖userAgent 字符串。但是，如果你要走那条路，我已经编写了一个完整的 sn-p，以及一个替代的 jQuery 实现来替换被贬低的$.browser。

原版JS

我的第一个 sn-p 只是将四个属性添加到 navigator 对象：browser、version、mobile 和 webkit。

jsFiddle

GitHub min

/** navigator [extended]
 *  Simply extends Browsers navigator Object to include browser name, version number, and mobile type (if available).
 *
 *  @property String browser The name of the browser.
 *  @property Double version The current Browser version number.
 *  @property String|Boolean mobile Will be `false` if is not found to be mobile device. Else, will be best guess Name of Mobile Device (not to be confused with browser name)
 *  @property Boolean webkit If is webkit or not.
 */
;(function()function c()tryswitch(!0)case /MSIE|Trident/i.test(navigator.userAgent):return"MSIE";case /Chrome/.test(navigator.userAgent):return"Chrome";case /Opera/.test(navigator.userAgent):return"Opera";case /Kindle|Silk|KFTT|KFOT|KFJWA|KFJWI|KFSOWI|KFTHWA|KFTHWI|KFAPWA|KFAPWI/i.test(navigator.userAgent):return/Silk/i.test(navigator.userAgent)?"Silk":"Kindle";case /BlackBerry/.test(navigator.userAgent):return"BlackBerry";case /PlayBook/.test(navigator.userAgent):return"PlayBook";case /BB[0-9]1,; Touch/.test(navigator.userAgent):return"Blackberry";
case /Android/.test(navigator.userAgent):return"Android";case /Safari/.test(navigator.userAgent):return"Safari";case /Firefox/.test(navigator.userAgent):return"Mozilla";case /Nokia/.test(navigator.userAgent):return"Nokia"catch(a)console.debug("ERROR:setBrowser\t",a)function d()tryswitch(!0)case /Sony[^ ]*/i.test(navigator.userAgent):return"Sony";case /RIM Tablet/i.test(navigator.userAgent):return"RIM Tablet";case /BlackBerry/i.test(navigator.userAgent):return"BlackBerry";case /iPhone/i.test(navigator.userAgent):return"iPhone";
case /iPad/i.test(navigator.userAgent):return"iPad";case /iPod/i.test(navigator.userAgent):return"iPod";case /Opera Mini/i.test(navigator.userAgent):return"Opera Mini";case /IEMobile/i.test(navigator.userAgent):return"IEMobile";case /BB[0-9]1,; Touch/i.test(navigator.userAgent):return"BlackBerry";case /Nokia/i.test(navigator.userAgent):return"Nokia";case /Android/i.test(navigator.userAgent):return"Android"catch(a)console.debug("ERROR:setMobile\t",a)return!1function e()tryswitch(!0)case /MSIE|Trident/i.test(navigator.userAgent):return/Trident/i.test(navigator.userAgent)&&
/rv:([0-9]1,[\.0-9]0,)/.test(navigator.userAgent)?parseFloat(navigator.userAgent.match(/rv:([0-9]1,[\.0-9]0,)/)[1].replace(/[^0-9\.]/g,"")):/MSIE/i.test(navigator.userAgent)&&0<parseFloat(navigator.userAgent.split("MSIE")[1].replace(/[^0-9\.]/g,""))?parseFloat(navigator.userAgent.split("MSIE")[1].replace(/[^0-9\.]/g,"")):"Edge";case /Chrome/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("Chrome/")[1].split("Safari")[0].replace(/[^0-9\.]/g,""));case /Opera/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("Version/")[1].replace(/[^0-9\.]/g,
""));case /Kindle|Silk|KFTT|KFOT|KFJWA|KFJWI|KFSOWI|KFTHWA|KFTHWI|KFAPWA|KFAPWI/i.test(navigator.userAgent):if(/Silk/i.test(navigator.userAgent))return parseFloat(navigator.userAgent.split("Silk/")[1].split("Safari")[0].replace(/[^0-9\.]/g,""));if(/Kindle/i.test(navigator.userAgent)&&/Version/i.test(navigator.userAgent))return parseFloat(navigator.userAgent.split("Version/")[1].split("Safari")[0].replace(/[^0-9\.]/g,""));case /BlackBerry/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("/")[1].replace(/[^0-9\.]/g,
""));case /PlayBook/.test(navigator.userAgent):case /BB[0-9]1,; Touch/.test(navigator.userAgent):case /Safari/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("Version/")[1].split("Safari")[0].replace(/[^0-9\.]/g,""));case /Firefox/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split(/Firefox\//i)[1].replace(/[^0-9\.]/g,""));case /Android/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("Version/")[1].split("Safari")[0].replace(/[^0-9\.]/g,
""));case /Nokia/.test(navigator.userAgent):return parseFloat(navigator.userAgent.split("Browser")[1].replace(/[^0-9\.]/g,""))catch(a)console.debug("ERROR:setVersion\t",a)a:tryif(navigator&&navigator.userAgent)navigator.browser=c();navigator.mobile=d();navigator.version=e();var b;b:tryb=/WebKit/i.test(navigator.userAgent);break bcatch(a)console.debug("ERROR:setWebkit\t",a)b=void 0navigator.webkit=b;break acatch(a)throw Error("Browser does not support `navigator` Object |OR| has undefined `userAgent` property.");
)();
/*  simple c & p of above   */

【讨论】：

我试过你的代码（Vanilla JS）..当我尝试使用 Firefox 和移动浏览器中的 Opera 时，它没有给出正确的输出 @RajaDhasan 原版更新。立即尝试。它可以在网络浏览器上完美运行.. 但是当我从 android mobile 尝试使用 chrome 浏览器时，它会打印 Android，而对于 opera，它会打印 chrome【参考方案20】：

您可以扫描用户代理来查找浏览器名称，而不是硬编码网络浏览器：

navigator.userAgent.split(')').reverse()[0].match(/(?!Gecko|Version|[A-Za-z]+?Web[Kk]it)[A-Z][a-z]+/g)[0]

我已经在 Safari、Chrome 和 Firefox 上对此进行了测试。如果您发现这不适用于浏览器，请告诉我。

Safari："Safari" 铬："Chrome" 火狐："Firefox"

如果需要，您甚至可以修改它以获取浏览器版本。请注意有更好的方法来获取浏览器版本

navigator.userAgent.split(')').reverse()[0].match(/(?!Gecko|Version|[A-Za-z]+?Web[Kk]it)[A-Z][a-z]+\/[\d.]+/g)[0].split('/')

示例输出：

Firefox/39.0

【讨论】：

不适用于某些不同的浏览器 - 即使在 IE 兼容模式下，它也将 UCBrowser 指向 Chrome，哈哈它说 Edge 是 Chrome...【参考方案21】：

以下是 2016 年检测浏览器的方法，包括 Microsoft Edge、Safari 10 和 Blink 检测：

// Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+
isSafari = /constructor/i.test(window.HTMLElement) || (function (p)  return p.toString() === "[object SafariRemoteNotification]"; )(!window['safari'] || safari.pushNotification);
// Internet Explorer 6-11
isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
isBlink = (isChrome || isOpera) && !!window.CSS;

这种方法的美妙之处在于它依赖于浏览器引擎属性，因此它甚至涵盖衍生浏览器，例如 Yandex 或 Vivaldi，它们实际上与它们使用的引擎的主要浏览器兼容。 Opera 是个例外，它依赖于用户代理嗅探，但今天（即 15 版及更高版本）甚至 Opera 本身也只是 Blink 的一个外壳。

【讨论】：

本页唯一正确答案。在最新的 IE 版本之后，导航器对象不再可靠。查看其他答案以获取有关这些测试所基于的文档：***.com/a/9851769/726097 @einjohn 也是我写的 :D 很高兴链接！ window.chrome.webstore 自 2018 年 6 月 12 日起已弃用，因此它会被评估为错误并且 Chrome 检测会中断。 @MihalyKR 谢谢，我一直在研究解决方案，很快就会更新。【参考方案22】：

我做了这个小功能，希望对你有帮助。在这里你可以找到最新版本 browserDetection

function detectBrowser(userAgent)
  var chrome  = /.*(Chrome\/).*(Safari\/).*/g;
  var firefox = /.*(Firefox\/).*/g;
  var safari  = /.*(Version\/).*(Safari\/).*/g;
  var opera   = /.*(Chrome\/).*(Safari\/).*(OPR\/).*/g

  if(opera.exec(userAgent))
    return "Opera"
  if(chrome.exec(userAgent))
    return "Chrome"
  if(safari.exec(userAgent))
    return "Safari"
  if(firefox.exec(userAgent))
    return "Firefox"

【讨论】：

【参考方案23】：

这是我正在使用的：

var ua = navigator.userAgent;
var info = 
        browser: /Edge\/\d+/.test(ua) ? 'ed' : /MSIE 9/.test(ua) ? 'ie9' : /MSIE 10/.test(ua) ? 'ie10' : /MSIE 11/.test(ua) ? 'ie11' : /MSIE\s\d/.test(ua) ? 'ie?' : /rv\:11/.test(ua) ? 'ie11' : /Firefox\W\d/.test(ua) ? 'ff' : /Chrom(e|ium)\W\d|Crios\W\d/.test(ua) ? 'gc' : /\bSafari\W\d/.test(ua) ? 'sa' : /\bOpera\W\d/.test(ua) ? 'op' : /\bOPR\W\d/i.test(ua) ? 'op' : typeof MSPointerEvent !== 'undefined' ? 'ie?' : '',
        os: /Windows NT 10/.test(ua) ? "win10" : /Windows NT 6\.0/.test(ua) ? "winvista" : /Windows NT 6\.1/.test(ua) ? "win7" : /Windows NT 6\.\d/.test(ua) ? "win8" : /Windows NT 5\.1/.test(ua) ? "winxp" : /Windows NT [1-5]\./.test(ua) ? "winnt" : /Mac/.test(ua) ? "mac" : /Linux/.test(ua) ? "linux" : /X11/.test(ua) ? "nix" : "",
        touch: 'ontouchstart' in document.documentElement,
        mobile: /IEMobile|Windows Phone|Lumia/i.test(ua) ? 'w' : /iPhone|iP[oa]d/.test(ua) ? 'i' : /Android/.test(ua) ? 'a' : /BlackBerry|PlayBook|BB10/.test(ua) ? 'b' : /Mobile Safari/.test(ua) ? 's' : /webOS|Mobile|Tablet|Opera Mini|\bCrMo\/|Opera Mobi/i.test(ua) ? 1 : 0,
        tablet: /Tablet|iPad/i.test(ua),
;

info属性：

browser: gc 用于谷歌浏览器； ie9-ie11 用于 IE； ie? 用于旧的或未知的 IE； ed 用于边缘； ff 用于火狐； sa 用于 Safari； op 为 Opera。 os:macwin7win8win10winntwinxpwinvistalinuxnix mobile: a 安卓； i 适用于 iOS (iPhone iPad)； w 适用于 Windows Phone； b 黑莓； s 用于未检测到的正在运行 Safari 的移动设备； 1 用于其他未检测到的手机； 0 用于非移动设备 touch：true 适用于支持触控的设备，包括同时具备鼠标和触控功能的触控笔记本电脑/笔记本电脑； false 不支持触摸 tablet: true 或 false

https://jsfiddle.net/oriadam/ncb4n882/

【讨论】：

【参考方案24】：

var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
var isFirefox = typeof InstallTrigger !== 'undefined';   // Firefox 1.0+
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
    // At least Safari 3+: "[object HTMLElementConstructor]"
var isChrome = !!window.chrome && !isOpera;              // Chrome 1+
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isIE Edge: ' + isEdge + '<br>';
document.body.innerHTML = output;

【讨论】：

【参考方案25】：

下面的代码 sn-p 将显示如何根据 IE 版本和浏览器显示 UI 元素

$(document).ready(function () 

var msiVersion = GetMSIieversion();
if ((msiVersion <= 8) && (msiVersion != false)) 

    //Show UI elements specific to IE version 8 or low

     else 
    //Show UI elements specific to IE version greater than 8 and for other browser other than IE,,ie..Chrome,Mozila..etc
    

);

下面的代码将给出我们如何获得 IE 版本

function GetMSIieversion() 

var ua = window.navigator.userAgent;
var msie = ua.indexOf('MSIE ');
if (msie > 0) 
    // IE 10 or older => return version number
    return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);


var trident = ua.indexOf('Trident/');
if (trident > 0) 
    // IE 11 => return version number
    var rv = ua.indexOf('rv:');
    return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);


var edge = ua.indexOf('Edge/');
if (edge > 0) 
    // Edge (IE 12+) => return version number
    return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);


// other browser like Chrome,Mozila..etc
return false;

【讨论】：

以上是关于JavaScript 中的浏览器检测？ [复制]的主要内容，如果未能解决你的问题，请参考以下文章

如何使用 javascript 检测浏览器名称和版本？ [复制]

如何在浏览器 JavaScript 中检测 OS X 是不是处于暗模式？ [复制]

如何检测 Javascript 中的页面宽度和高度？ [复制]

在 Javascript 中进行浏览器检测的最佳方法是啥？

如何使用javascript检测浏览器中的手机事件？

如何检测 WebBrowser 控件中的 Javascript 执行