如何检测 Safari、Chrome、IE、Firefox 和 Opera 浏览器？
我有 5 个用于 Firefox、Chrome、Internet Explorer(IE)、Opera 和 Safari 的插件/扩展。
如何正确识别用户浏览器并重定向（单击安装按钮后）以下载相应的插件？
userAgent功能，甚至w3schools也承认这是不准确的。我已经测试了这个问题和类似问题的一些答案，但它们似乎都不可靠。如果我最好提出一个新问题，请告诉我。
谷歌搜索浏览器可靠检测通常会导致检查用户代理字符串。此方法不可靠，因为欺骗此值很简单。
我编写了一个方法来通过 duck-typing 检测浏览器。
仅在确实需要时才使用浏览器检测方法，例如显示特定于浏览器的说明来安装扩展程序。尽可能使用特征检测。
演示：https://jsfiddle.net/6spj1059/
// Opera 8.0+ var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf('OPR/') >= 0; // Firefox 1.0+ var isFirefox = typeof InstallTrigger !== 'undefined'; // Safari 3.0+ "[object HTMLElementConstructor]" var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && window['safari'] 。推送通知））; // Internet Explorer 6-11 var isIE = /*@cc_on!@*/false || !!document.documentMode; // Edge 20+ var isEdge = !isIE && !!window.StyleMedia; // Chrome 1 - 79 var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime); // 边缘（基于铬）检测 var isEdgeChromium = isChrome && (navigator.userAgent.indexOf("Edg") != -1); // 闪烁引擎检测 var isBlink = (isChrome || isOpera) && !!window.CSS; var output = '通过ducktyping检测浏览器：
';输出 += 'isFirefox: ' + isFirefox + '
';输出 += 'isChrome: ' + isChrome + '
';输出 += 'isSafari: ' + isSafari + '
';输出 += 'isOpera: ' + isOpera + '
';输出 += 'isIE: ' + isIE + '
';输出 += 'isEdge: ' + isEdge + '
';输出 += 'isEdgeChromium: ' + isEdgeChromium + '
';输出 += 'isBlink: ' + isBlink + '
'; document.body.innerHTML = 输出；
可靠性分析
previous method 依赖于呈现引擎（-moz-box-sizing 和 -webkit-transform）的属性来检测浏览器。这些前缀最终将被删除，因此为了使检测更加健壮，我切换到浏览器特定的特征：
Internet Explorer：JScript 的条件编译（直到 IE9）和 document.documentMode。
Edge：在 Trident 和 Edge 浏览器中，Microsoft 的实现公开了 StyleMedia 构造函数。排除三叉戟给我们留下了Edge。
Edge（基于 chromium）：用户代理在末尾包含值“Edg/[version]”（例如：“Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ 80.0.3987.16 Safari/537.36 边缘/80.0.361.9"）。
Firefox：Firefox 用于安装附加组件的 API：InstallTrigger
Chrome：全局 chrome 对象，包含多个属性，包括文档化的 chrome.webstore 对象。
更新 3 chrome.webstore 在最新版本中已弃用且未定义
Safari：构造函数命名的独特命名模式。这是所有列出的属性中最不耐用的方法，你猜怎么着？在 Safari 9.1.3 中已修复。因此，我们正在检查 SafariRemoteNotification，它是在 7.1 版之后引入的，以涵盖 3.0 及更高版本的所有 Safari。
Opera：window.opera 已存在多年，但当 Opera 将其引擎替换为 Blink + V8（由 Chromium 使用）时将被删除。
更新 1：Opera 15 已经发布，它的 UA 字符串看起来像 Chrome，但添加了“OPR”。在这个版本中定义了 chrome 对象（但 chrome.webstore 没有）。由于 Opera 试图克隆 Chrome，我为此使用了用户代理嗅探。
更新 2：!!window.opr && opr.addons 可用于检测 Opera 20+（常绿）。
Blink：一旦 Google 开启 Chrome 28，CSS.supports() 就在 Blink 中引入。当然，它与 Opera 中使用的 Blink 相同。
成功测试：
火狐 0.8 - 61
铬 1.0 - 71
歌剧 8.0 - 34
野生动物园 3.0 - 10
即 6 - 11
边缘 - 20-42
边缘开发 - 80.0.361.9
2016 年 11 月更新，包括对 9.1.3 及更高版本的 Safari 浏览器的检测 2018 年 8 月更新，以更新 chrome、firefox IE 和 edge 的最新成功测试。于 2019 年 1 月更新以修复 chrome 检测（由于 window.chrome.webstore 弃用）并包括最新的成功测试 chrome。于 2019 年 12 月更新以添加基于 Chromium 检测的 Edge（基于 @Nimesh 评论）。
您可以尝试以下方式检查浏览器版本。
<!DOCTYPE html>
<html>
<body>
<p>What is the name(s) of your browser?</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 )
{
alert('Opera');
}
else if(navigator.userAgent.indexOf("Edg") != -1 )
{
alert('Edge');
}
else if(navigator.userAgent.indexOf("Chrome") != -1 )
{
alert('Chrome');
}
else if(navigator.userAgent.indexOf("Safari") != -1)
{
alert('Safari');
}
else if(navigator.userAgent.indexOf("Firefox") != -1 )
{
alert('Firefox');
}
else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
{
alert('IE');
}
else
{
alert('unknown');
}
}
</script>
</body>
</html>
如果您只需要知道 IE 浏览器版本，那么您可以按照以下代码进行操作。此代码适用于版本 IE6 到 IE11
<!DOCTYPE html>
<html>
<body>
<p>Click on Try button to check IE Browser version.</p>
<button onclick="getInternetExplorerVersion()">Try it</button>
<p id="demo"></p>
<script>
function getInternetExplorerVersion() {
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
var rv = -1;
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number
{
if (isNaN(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))))) {
//For IE 11 >
if (navigator.appName == 'Netscape') {
var ua = navigator.userAgent;
var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
if (re.exec(ua) != null) {
rv = parseFloat(RegExp.$1);
alert(rv);
}
}
else {
alert('otherbrowser');
}
}
else {
//For < IE11
alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
}
return false;
}}
</script>
</body>
</html>
chrome 关键字。 Safari 用户代理示例 - mozilla/5.0 (macintosh; intel mac os x 10_11_5) applewebkit/601.6.17 (khtml, like gecko) version/9.1.1 safari/601.6.17
if(navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )
以下是截至 2019 年 12 月处理浏览器检测的几个著名库。
Bowser by lancedikson - 4,065★s - 最后更新于 2019 年 10 月 2 日 - 4.8KB
var 结果 = bowser.getParser(window.navigator.userAgent);控制台.log（结果）； document.write("你正在使用 " + result.parsedResult.browser.name + " v" + result.parsedResult.browser.version + " on " + result.parsedResult.os.name);
*支持基于 Chromium 的 Edge
由 bestiejs 编写的 Platform.js - 2,550★s - 最后更新于 2019 年 4 月 14 日 - 5.9KB
控制台.log（平台）； document.write("你正在使用 " + platform.name + " v" + platform.version + " on " + platform.os);
jQuery Browser by gabceb - 504★s - 最后更新于 2015 年 11 月 23 日 - 1.3KB
console.log($.browser) document.write("你正在使用 " + $.browser.name + " v" + $.browser.versionNumber + " on " + $.browser.platform);
Detect.js（存档）由 darcyclarke - 522★s - 最后更新于 2015 年 10 月 26 日 - 2.9KB
var 结果 = 检测.parse(navigator.userAgent);控制台.log（结果）； document.write("你正在使用 " + result.browser.family + " v" + result.browser.version + " on " + result.os.family);
QuirksMode 的浏览器检测（存档） - 最后更新于 2013 年 11 月 14 日 - 884B
console.log(BrowserDetect) document.write("你正在使用 " + BrowserDetect.browser + " v" + BrowserDetect.version + " on " + BrowserDetect.OS);
值得注意的提及：
WhichBrowser - 1,355★s - 最后更新于 2018 年 10 月 2 日
Modernizr - 23,397★s - 最后更新于 2019 年 1 月 12 日 - 为了喂饱一匹马，特征检测应该驱动任何 canIuse 风格的问题。浏览器检测实际上只是为单个浏览器提供自定义图像、下载文件或说明。
延伸阅读
Stack Overflow - JavaScript 中的浏览器检测？
Stack Overflow - 如何检测浏览器的版本？
我知道为此使用 lib 可能有点矫枉过正，但只是为了丰富线程，您可以检查 is.js 这样做的方式：
is.firefox();
is.ie(6);
is.not.safari();
is.js 的源代码并检查他们是如何做到的。
万一有人觉得这很有用，我将 Rob W's answer 变成了一个返回浏览器字符串的函数，而不是让多个变量浮动。由于浏览器在不重新加载的情况下也无法真正更改，因此我已将其缓存结果以防止它在下次调用该函数时需要解决它。
/** * 获取浏览器名称，如果未知则返回空字符串。 * 该函数还缓存结果以提供给该函数未来的任何调用。 * * @returns {string} */ var browser = function() { // 如果可用则返回缓存结果，否则获取结果然后缓存它。 if (browser.prototype._cachedResult) 返回 browser.prototype._cachedResult； // Opera 8.0+ var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf('OPR/') >= 0; // Firefox 1.0+ var isFirefox = typeof InstallTrigger !== 'undefined'; // Safari 3.0+ "[object HTMLElementConstructor]" var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification); // Internet Explorer 6-11 var isIE = /*@cc_on!@*/false || !!document.documentMode; // Edge 20+ var isEdge = !isIE && !!window.StyleMedia; // Chrome 1+ var isChrome = !!window.chrome && !!window.chrome.webstore; // 闪烁引擎检测 var isBlink = (isChrome || isOpera) && !!window.CSS;返回 browser.prototype._cachedResult = isOpera ？ 'Opera'：是火狐吗？ “火狐”：是 Safari 吗？ 'Safari'：是 Chrome 吗？ “铬”：是 IE 吗？ “IE”：是边缘？ “边缘”：是闪烁？ '眨眼'：“不知道”； };控制台.log（浏览器（））；
window.chrome.webstore，因此这种方法不再有效。
短变体（2020 年 7 月 10 日更新移动浏览器检测修复）
var browser = (function() { var test = function(regexp) {return regexp.test(window.navigator.userAgent)} switch (true) { case test(/edg/i): return "Microsoft Edge"; case test (/trident/i): 返回 "Microsoft Internet Explorer"; case test(/firefox|fxios/i): return "Mozilla Firefox"; case test(/opr\//i): return "Opera"; case test( /ucbrowser/i): 返回 "UC 浏览器"; case test(/samsungbrowser/i): return "三星浏览器"; case test(/chrome|chromium|crios/i): return "Google Chrome"; case test(/ safari/i): 返回 "Apple Safari"; 默认: 返回 "Other"; } })();控制台日志（浏览器）
不知道它是否对任何人有用，但这里有一个可以让 TypeScript 开心的变体：
export function getBrowser() {
// Opera 8.0+
if ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0) {
return 'opera';
}
// Firefox 1.0+
if (typeof window["InstallTrigger"] !== 'undefined') {
return 'firefox';
}
// Safari 3.0+ "[object HTMLElementConstructor]"
if (/constructor/i.test(window["HTMLElement"]) || (function(p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof window["safari"] !== 'undefined' && window["safari"].pushNotification))) {
return 'safari';
}
// Internet Explorer 6-11
if (/*@cc_on!@*/false || !!document["documentMode"]) {
return 'ie';
}
// Edge 20+
if (!(/*@cc_on!@*/false || !!document["documentMode"]) && !!window["StyleMedia"]) {
return 'edge';
}
// Chrome 1+
if (!!window["chrome"] && !!window["chrome"].webstore) {
return 'chrome';
}
// Blink engine detection
if (((!!window["chrome"] && !!window["chrome"].webstore) || ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0)) && !!window["CSS"]) {
return 'blink';
}
}
这是 Rob 答案的 2016 年调整版本，包括 Microsoft Edge 和 Blink 检测：
（编辑：我用这些信息更新了上面 Rob 的答案。）
// Opera 8.0+（UA 检测以检测基于 Blink/v8 的 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; // 边缘 20+ isEdge = !isIE && !!window.StyleMedia; // Chrome 1+ isChrome = !!window.chrome && !!window.chrome.webstore; // 闪烁引擎检测 isBlink = (isChrome || isOpera) && !!window.CSS; /* 结果： */ console.log("isOpera", isOpera); console.log("isFirefox", isFirefox); console.log("isSafari", isSafari); console.log("isIE", isIE); console.log("isEdge", isEdge); console.log("isChrome", isChrome); console.log("isBlink", isBlink);
这种方法的美妙之处在于它依赖于浏览器引擎的属性，因此它甚至涵盖了衍生浏览器，例如 Yandex 或 Vivaldi，它们实际上与它们使用的引擎的主要浏览器兼容。 Opera 是个例外，它依赖于用户代理嗅探，但今天（即 15 版及更高版本）甚至 Opera 本身也只是 Blink 的一个外壳。
!!window.MSAssertion; 测试不适用于我在 Edge Beta 中通过远程桌面进行的操作。它返回假。
MSAssertion 技巧已调整为版本 25。但由于许多开发人员依赖虚拟机，我将尝试将其调整为旧版本。好决定。谢谢。
StyleMedia（大写）对象是特定于 IE 和 Edge 的，似乎不会出现在任何地方。
谢谢大家。我在最近的浏览器上测试了这里的代码片段：Chrome 55、Firefox 50、IE 11 和 Edge 38，我想出了以下对我都适用的组合。我确信它可以改进，但对于任何需要的人来说，它都是一个快速的解决方案：
var browser_name = '';
isIE = /*@cc_on!@*/false || !!document.documentMode;
isEdge = !isIE && !!window.StyleMedia;
if(navigator.userAgent.indexOf("Chrome") != -1 && !isEdge)
{
browser_name = 'chrome';
}
else if(navigator.userAgent.indexOf("Safari") != -1 && !isEdge)
{
browser_name = 'safari';
}
else if(navigator.userAgent.indexOf("Firefox") != -1 )
{
browser_name = 'firefox';
}
else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
{
browser_name = 'ie';
}
else if(isEdge)
{
browser_name = 'edge';
}
else
{
browser_name = 'other-browser';
}
$('html').addClass(browser_name);
它向 HTML 添加了一个 CSS 类，带有浏览器的名称。
您可以使用 try 和 catch 来使用不同的浏览器错误消息。 IE 和 edge 混淆了，但我使用了 Rob W 的鸭子类型（基于这里的这个项目：https://www.khanacademy.org/computer-programming/i-have-opera/2395080328）。
var getBrowser = function() {
try {
var e;
var f = e.width;
} catch(e) {
var err = e.toString();
if(err.indexOf("not an object") !== -1) {
return "safari";
} else if(err.indexOf("Cannot read") !== -1) {
return "chrome";
} else if(err.indexOf("e is undefined") !== -1) {
return "firefox";
} else if(err.indexOf("Unable to get property 'width' of undefined or null reference") !== -1) {
if(!(false || !!document.documentMode) && !!window.StyleMedia) {
return "edge";
} else {
return "IE";
}
} else if(err.indexOf("cannot convert e into object") !== -1) {
return "opera";
} else {
return undefined;
}
}
};
如果您需要知道某个特定浏览器的数字版本是什么，您可以使用以下代码段。目前它会告诉你 Chrome/Chromium/Firefox 的版本：
var match = $window.navigator.userAgent.match(/(?:Chrom(?:e|ium)|Firefox)\/([0-9]+)\./);
var ver = match ? parseInt(match[1], 10) : 0;
检测桌面和移动浏览器：Edge、Opera、Chrome、Safari、Firefox、IE
我对@nimesh 代码进行了一些更改，现在它也适用于 Edge，并且修复了 Opera 问题：
function getBrowserName() {
if ( navigator.userAgent.indexOf("Edge") > -1 && navigator.appVersion.indexOf('Edge') > -1 ) {
return 'Edge';
}
else if( navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )
{
return 'Opera';
}
else if( navigator.userAgent.indexOf("Chrome") != -1 )
{
return 'Chrome';
}
else if( navigator.userAgent.indexOf("Safari") != -1)
{
return 'Safari';
}
else if( navigator.userAgent.indexOf("Firefox") != -1 )
{
return 'Firefox';
}
else if( ( navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true ) ) //IF IE > 10
{
return 'IE';
}
else
{
return 'unknown';
}
}
谢谢@nimesh 用户：2063564
还有一种适用于所有流行浏览器的“hacky”方法。 Google 在其 Closure Library 中包含了浏览器检查。特别是看一下 goog.userAgent 和 goog.userAgent.product。通过这种方式，如果浏览器呈现自身的方式发生变化，您也可以及时了解（假设您始终运行最新版本的闭包编译器。）
UAParser 是轻量级 JavaScript 库之一，用于从 userAgent 字符串中识别浏览器、引擎、操作系统、CPU 和设备类型/型号。
有一个可用的 CDN。在这里，我包含了一个使用 UAParser 检测浏览器的示例代码。
<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script type="text/javascript">
var parser = new UAParser();
var result = parser.getResult();
console.log(result.browser); // {name: "Chromium", version: "15.0.874.106"}
</script>
</head>
<body>
</body>
</html>
现在您可以使用 result.browser 的值对您的页面进行有条件的编程。
源教程：How to detect browser, engine, OS, CPU, and device using JavaScript?
检测浏览器及其版本
此代码段基于来自 MDN 的文章。他们在其中简要提示了可用于检测浏览器名称的各种关键字。
https://i.stack.imgur.com/BUfGl.png
上图中显示的数据不足以检测所有浏览器，例如 Firefox 的 userAgent 将 Fxios 作为关键字而不是 Firefox。
还进行了一些更改以检测 Edge 和 UCBrowser 等浏览器
该代码目前在开发工具 (How to change userAgent) 的帮助下通过更改 userAgent 来测试以下浏览器：
火狐
铬合金
IE
边缘
歌剧
苹果浏览器
UC浏览器
getBrowser = () => { const userAgent = navigator.userAgent;让浏览器=“未知”； // 检测浏览器名称 browser = (/ucbrowser/i).test(userAgent) ? 'UCBrowser' : 浏览器；浏览器 = (/edg/i).test(userAgent) ？ “边缘”：浏览器；浏览器 = (/googlebot/i).test(userAgent) ？ 'GoogleBot' : 浏览器；浏览器 = (/chromium/i).test(userAgent) ？ “铬”：浏览器；浏览器 = (/firefox|fxios/i).test(userAgent) && !(/seamonkey/i).test(userAgent) ？ 'Firefox' : 浏览器； browser = (/; msie|trident/i).test(userAgent) && !(/ucbrowser/i).test(userAgent) ? 'IE' : 浏览器; browser = (/chrome|crios/i).test(userAgent) && !(/opr|opera|chromium|edg|ucbrowser|googlebot/i).test(userAgent) ? 'Chrome' : 浏览器;; browser = (/safari/i).test(userAgent) && !(/chromium|edg|ucbrowser|chrome|crios|opr|opera|fxios|firefox/i).test(userAgent) ? 'Safari' : 浏览器；浏览器 = (/opr|opera/i).test(userAgent) ？ 'Opera' : 浏览器; // 检测浏览器版本切换 (browser) { case 'UCBrowser': return `${browser}/${browserVersion(userAgent,/(ucbrowser)\/([\d\.]+)/i)}`;案例'Edge'：返回`${browser}/${browserVersion(userAgent,/(edge|edga|edgios|edg)\/([\d\.]+)/i)}`；案例“GoogleBot”：返回 `${browser}/${browserVersion(userAgent,/(googlebot)\/([\d\.]+)/i)}`； case 'Chromium': return `${browser}/${browserVersion(userAgent,/(chromium)\/([\d\.]+)/i)}`; case 'Firefox': 返回 `${browser}/${browserVersion(userAgent,/(firefox|fxios)\/([\d\.]+)/i)}`;案例“Chrome”：返回 `${browser}/${browserVersion(userAgent,/(chrome|crios)\/([\d\.]+)/i)}`； case 'Safari': return `${browser}/${browserVersion(userAgent,/(safari)\/([\d\.]+)/i)}`; case 'Opera': return `${browser}/${browserVersion(userAgent,/(opera|opr)\/([\d\.]+)/i)}`; case 'IE': const version = browserVersion(userAgent,/(trident)\/([\d\.]+)/i); // IE 版本使用 trident 版本映射 // IE/8.0 = Trident/4.0, IE/9.0 = Trident/5.0 返回版本 ? `${browser}/${parseFloat(version) + 4.0}` : `${browser}/7.0`;默认值：返回“未知/0.0.0.0”； } } browserVersion = (userAgent,regex) => { return userAgent.match(regex) ? userAgent.match(regex)[2] : null; } console.log(getBrowser());
您可以使用 Detect-browser.js，检测和打印浏览器信息对象的 JavaScript 库，包括浏览器语言/名称、用户代理、设备类型、用户操作系统、引用者、在线/离线、用户时区、屏幕分辨率和启用 cookie .
从这里获取它detect-browser.js
它会给你类似的东西：
https://i.stack.imgur.com/plxVO.png
这是我的定制解决方案。
const inBrowser = typeof window !== 'undefined'
const UA = inBrowser && window.navigator.userAgent.toLowerCase()
const isIE =
UA && /; msie|trident/i.test(UA) && !/ucbrowser/i.test(UA).test(UA)
const isEdge = UA && /edg/i.test(UA)
const isAndroid = UA && UA.indexOf('android') > 0
const isIOS = UA && /iphone|ipad|ipod|ios/i.test(UA)
const isChrome =
UA &&
/chrome|crios/i.test(UA) &&
!/opr|opera|chromium|edg|ucbrowser|googlebot/i.test(UA)
const isGoogleBot = UA && /googlebot/i.test(UA)
const isChromium = UA && /chromium/i.test(UA)
const isUcBrowser = UA && /ucbrowser/i.test(UA)
const isSafari =
UA &&
/safari/i.test(UA) &&
!/chromium|edg|ucbrowser|chrome|crios|opr|opera|fxios|firefox/i.test(UA)
const isFirefox = UA && /firefox|fxios/i.test(UA) && !/seamonkey/i.test(UA)
const isOpera = UA && /opr|opera/i.test(UA)
const isMobile =
/\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(UA) ||
/\b(Android|Windows Phone|iPad|iPod)\b/i.test(UA)
const isSamsung = UA && /samsungbrowser/i.test(UA)
const isIPad = UA && /ipad/.test(UA)
const isIPhone = UA && /iphone/.test(UA)
const isIPod = UA && /ipod/.test(UA)
console.log({
UA,
isAndroid,
isChrome,
isChromium,
isEdge,
isFirefox,
isGoogleBot,
isIE,
isMobile,
isIOS,
isIPad,
isIPhone,
isIPod,
isOpera,
isSafari,
isSamsung,
isUcBrowser,
}
}
var BrowserDetect = {
init: function () {
this.browser = this.searchString(this.dataBrowser) || "Other";
this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) || "Unknown";
},
searchString: function (data) {
for (var i = 0; i < data.length; i++) {
var dataString = data[i].string;
this.versionSearchString = data[i].subString;
if (dataString.indexOf(data[i].subString) !== -1) {
return data[i].identity;
}
}
},
searchVersion: function (dataString) {
var index = dataString.indexOf(this.versionSearchString);
if (index === -1) {
return;
}
var rv = dataString.indexOf("rv:");
if (this.versionSearchString === "Trident" && rv !== -1) {
return parseFloat(dataString.substring(rv + 3));
} else {
return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
}
},
dataBrowser: [
{string: navigator.userAgent, subString: "Edge", identity: "MS Edge"},
{string: navigator.userAgent, subString: "MSIE", identity: "Explorer"},
{string: navigator.userAgent, subString: "Trident", identity: "Explorer"},
{string: navigator.userAgent, subString: "Firefox", identity: "Firefox"},
{string: navigator.userAgent, subString: "Opera", identity: "Opera"},
{string: navigator.userAgent, subString: "OPR", identity: "Opera"},
{string: navigator.userAgent, subString: "Chrome", identity: "Chrome"},
{string: navigator.userAgent, subString: "Safari", identity: "Safari"}
]
};
BrowserDetect.init();
var bv= BrowserDetect.browser;
if( bv == "Chrome"){
$("body").addClass("chrome");
}
else if(bv == "MS Edge"){
$("body").addClass("edge");
}
else if(bv == "Explorer"){
$("body").addClass("ie");
}
else if(bv == "Firefox"){
$("body").addClass("Firefox");
}
$(".relative").click(function(){
$(".oc").toggle('slide', { direction: 'left', mode: 'show' }, 500);
$(".oc1").css({
'width' : '100%',
'margin-left' : '0px',
});
});
铬& Edge 为此引入了一个新的 User-Agent Client Hints API：
navigator.userAgentData.brands.map(item => item.brand).includes('Google Chrome')
不幸的是，Firefox 和 Safari 还不支持它。
使用以下代码检查 IE 浏览器。
console.log(/MSIE|Trident/.test(window.navigator.userAgent))
或者
var isIE = !!document.documentMode;
console.log(isIE)
谢谢
This 结合了 Rob 的原始答案和 Pilau 的 2016 年更新
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;
在这里，您可以了解它正在运行哪个浏览器。
function isValidBrowser(navigator){
var isChrome = navigator.indexOf('chrome'),
isFireFox= navigator.indexOf('firefox'),
isIE = navigator.indexOf('trident') ,
isValidChromeVer = parseInt(navigator.substring(isChrome+7, isChrome+8)) >= 4,
isValidFireForVer = parseInt(navigator.substring(isFireFox+8, isFireFox+9)) >= 3,
isValidIEVer = parseInt(navigator.substring(isIE+8, isIE+9)) >= 7;
if((isChrome > -1 && isValidChromeVer){ console.log("Chrome Browser")}
if(isFireFox > -1 && isValidFireForVer){ console.log("FireFox Browser")}
if(isIE > -1 && isValidIEVer)){ console.log("IE Browser")}
}
我们可以使用以下 util 方法
utils.isIE = function () {
var ver = navigator.userAgent;
return ver.indexOf("MSIE") !== -1 || ver.indexOf("Trident") !== -1; // need to check for Trident for IE11
};
utils.isIE32 = function () {
return (utils.isIE() && navigator.appVersion.indexOf('Win64') === -1);
};
utils.isChrome = function () {
return (window.chrome);
};
utils.isFF64 = function () {
var agent = navigator.userAgent;
return (agent.indexOf('Win64') >= 0 && agent.indexOf('Firefox') >= 0);
};
utils.isFirefox = function () {
return (navigator.userAgent.toLowerCase().indexOf('firefox') > -1);
};
const isChrome = /Chrome/.test(navigator.userAgent)
const isFirefox = /Firefox/.test(navigator.userAgent)
您可以像这样检测它：
if (typeof navigator !== 'undefined' && navigator.userAgent && navigator.userAgent.toLowerCase().match(/firefox\/(\d+)/)) {
alert('Firefox');
}
import getAgent, { getAccurateAgent } from "@egjs/agent";
const agent = getAgent();
getAccurateAgent().then((accurate_agent)=>{
console.log(agent,'accurate.');
})
console.log(agent);
https://github.com/naver/egjs-agent
简单的：
var OSName="未知操作系统"; if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; if (navigator.appVersion.indexOf("Linux x86_64")!=-1) OSName="Ubuntu"; var nVer = navigator.appVersion; var nAgt = navigator.userAgent; var browserName = navigator.appName; var fullVersion = ''+parseFloat(navigator.appVersion); var majorVersion = parseInt(navigator.appVersion,10); var nameOffset,verOffset,ix; // 在 Opera 中，真正的版本在 "Opera" 之后或 "Version" 之后 if ((verOffset=nAgt.indexOf("Opera"))!=-1) { browserName = "Opera"; fullVersion = nAgt.substring(verOffset+6); if ((verOffset=nAgt.indexOf("Version"))!=-1) fullVersion = nAgt.substring(verOffset+8); } // 在 MSIE 中，真正的版本在 userAgent 中的 "MSIE" 之后 else if ((verOffset=nAgt.indexOf("MSIE"))!=-1) { browserName = "Microsoft Internet Explorer"; fullVersion = nAgt.substring(verOffset+5); } // 在 Chrome 中，真正的版本在 "Chrome" 之后 else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) { browserName = "Chrome"; fullVersion = nAgt.substring(verOffset+7); } // 在 Safari 中，真正的版本在 "Safari" 之后或 "Version" 之后 else if ((verOffset=nAgt.indexOf("Safari"))!=-1) { browserName = "Safari"; fullVersion = nAgt.substring(verOffset+7); if ((verOffset=nAgt.indexOf("Version"))!=-1) fullVersion = nAgt.substring(verOffset+8); } // 在 Firefox 中，真正的版本在 "Firefox" 之后 else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) { browserName = "Firefox"; fullVersion = nAgt.substring(verOffset+8); } // 在大多数其他浏览器中，“名称/版本”位于 userAgent 的末尾 else if ( (nameOffset=nAgt.lastIndexOf(' ')+1) < (verOffset=nAgt.lastIndexOf('/')) ) { browserName = nAgt.substring(nameOffset,verOffset); fullVersion = nAgt.substring(verOffset+1); if (browserName.toLowerCase()==browserName.toUpperCase()) { browserName = navigator.appName; } } // 在分号/空格处修剪 fullVersion 字符串 if ((ix=fullVersion.indexOf(";"))!=-1) fullVersion=fullVersion.substring(0,ix); if ((ix=fullVersion.indexOf(" "))!=-1) fullVersion=fullVersion.substring(0,ix); majorVersion = parseInt(''+fullVersion,10); if (isNaN(majorVersion)) { fullVersion = ''+parseFloat(navigator.appVersion); majorVersion = parseInt(navigator.appVersion,10); } document.write('' +'嘿！我看到你在使用'+browserName+'！
' +'完整版是'+fullVersion+'。
' +'你的主要版本是'+majorVersion+',
' +'你的“navigator.appName”是'+navigator.appName+'。
' +'你的“navigator.userAgent”是'+navigator.userAgent+'。
' ) document.write('而且，你的操作系统是'+OSName+'。
');
简单的单行 JavaScript 代码将为您提供浏览器的名称：
function GetBrowser()
{
return navigator ? navigator.userAgent.toLowerCase() : "other";
}
navigator.userAgent 告诉您可能拥有的每个浏览器。所以这确实不可靠，唯一可行的情况是用户只有一个浏览器。
window.chrome.webstore在那里未定义。没有用 Firefox 扩展检查它。is.js在其他地方提到的确实适用于 Chrome 和 Firefox 扩展程序。isSafari不适用于 Safari 10。我认为这是一个糟糕的解决方案（并不是说我有一个好的解决方案）。无法保证您检查的许多内容不会被删除或不会被其他浏览器添加。每个使用此代码检查 Safari 的网站都因 macOS Sierra 或 Safari 10 升级而中断:(isSafari在 Safari 10.1.2 下的<iframe>下不起作用