JavaScript 中的浏览器检测？

Question

提问by Probocop

How do I determine the exact browser and version using JavaScript?

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

Answer 1

回答by kennebec

navigator.sayswho= (function(){
    var ua= navigator.userAgent, tem,
    M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
    if(/trident/i.test(M[1])){
        tem=  /\brv[ :]+(\d+)/g.exec(ua) || [];
        return 'IE '+(tem[1] || '');
    }
    if(M[1]=== 'Chrome'){
        tem= ua.match(/\b(OPR|Edge?)\/(\d+)/);
        if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera').replace('Edg ', 'Edge ');            
    }
    M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
    if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]);
    return M.join(' ');
})();

As the name implies, this will tell you the name and version number supplied by the browser.

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

It is handy for sorting test and error results, when you are testing new code on multiple browsers.

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

Answer 2

回答by arikan

I recommend using the tiny javascript library Bowser, yes no r. It is based on the navigator.userAgentand quite well tested for all browsers including iphone, android etc.

我建议使用小型 javascript 库 Bowser，是的，不是 r。它基于对navigator.userAgent所有浏览器（包括 iphone、android 等）进行了很好的测试。

https://github.com/ded/bowser

You can use simply say:

你可以简单地说：

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');
}

Answer 3

回答by Arun P Johny

This is something I wrote to get client info

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

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' : '';
}

Answer 4

回答by pilau

Here's how to detect browsers in 2016, including Microsoft Edge, Safari 10 and detection of Blink:

以下是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;

The beauty of this approach is that it relies on browser engine properties, so it covers even derivative browsers, such as Yandex or Vivaldi, which are practically compatible with the major browsers whose engines they use. The exception is Opera, which relies on user agent sniffing, but today (i.e. ver. 15 and up) even Opera is itself only a shell for Blink.

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

Answer 5

回答by Phil Rykoff

It is usually best to avoid browser-specific code where possible. The JQuery $.supportproperty is available for detection of support for particular features rather than relying on browser name and version.

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

In Opera for example, you can fake an internet explorer or firefox instance.

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

alt text

替代文字

A detailed description of JQuery.support can be found here: http://api.jquery.com/jQuery.support/

可以在此处找到 JQuery.support 的详细说明：http://api.jquery.com/jQuery.support/

Now deprecated according to jQuery.

现在已根据 jQuery 弃用。

We strongly recommend the use of an external library such as Modernizrinstead of dependency on properties in jQuery.support.

我们强烈建议使用外部库，例如Modernizr而不是依赖于jQuery.support.

When coding websites, I always make sure, that basic functionality like navigation is also accessible to non-js users. This may be object to discussion and can be ignored if the homepage is targeted to a special audience.

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

Answer 6

回答by malcolmX

This tells you all the details about your browser and the version of it.

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

<!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>

Answer 7

回答by Andrew

All the information about web browser is contained in navigator object. The name and version are there.

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

var appname = window.navigator.appName;

Source: javascript browser detection

来源：javascript浏览器检测

Answer 8

回答by Wayne Bulmer

//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

Answer 9

回答by ghiscoding

Since Internet Explorer 11 (IE11+) came out and is not using the tag name of MSIEanymore I came up with a variance of an older detection function:

由于 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;
})();

Answer 10

回答by user2183078

Sadly, IE11 no longer has MSIEin its navigator.userAgent:

可悲的是，IE11不再拥有MSIE在其navigator.userAgent：

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

As to why you want to know which browser you're using, it's because every browser has its own set of bugs, and you end up implementing browser and version specific workarounds, or tell the user to use a different browser!

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

JavaScript 中的浏览器检测？

提问by Probocop

回答by kennebec

回答by arikan

回答by Arun P Johny

回答by pilau

回答by Phil Rykoff

回答by malcolmX

回答by Andrew

回答by Wayne Bulmer

回答by ghiscoding

回答by user2183078

相关推荐

最近更新

标签

JavaScript 中的浏览器检测？

提问by Probocop

回答by kennebec

回答by arikan

回答by Arun P Johny

回答by pilau

回答by Phil Rykoff

回答by malcolmX

回答by Andrew

回答by Wayne Bulmer

回答by ghiscoding

回答by user2183078

相关推荐

Javascript ng-mouseover 上的 Angular JS 更改类

Javascript Jquery：将事件更改为 IE 上的输入文件

Javascript 从对象中获取具有最高值的键

Javascript jQuery“hasParent”

相关推荐

最近更新

标签