如何使用 jQuery 检测浏览器是不是是 Chrome?

Posted

技术标签:

【中文标题】如何使用 jQuery 检测浏览器是不是是 Chrome?【英文标题】:How to detect if a browser is Chrome using jQuery?如何使用 jQuery 检测浏览器是否是 Chrome? 【发布时间】:2011-09-14 10:22:36 【问题描述】:

我在 chrome 中运行的函数在 Safari 和 webkit 浏览器中都能正常运行时遇到了一点问题......

我需要在函数中为 Chrome 自定义一个变量,而不是为 Safari。

遗憾的是,我一直在使用它来检测它是否是 webkit 浏览器:

if ($.browser.webkit) 

但我需要检测:

if ($.browser.chrome) 

有没有办法写出类似的语句(上述语句的工作版本)?

【问题讨论】:

也许您可以发布损坏的功能,看看我们是否可以帮助您让它在 chrome 中也能工作? 函数比较长,我知道怎么解决,我只需要能够为Chrome自定义吧 ***.com/questions/3303858/… 这是个好主意,我只是觉得我已经完成了足够的工作,知道问题出在哪里 海姆,谢谢。您能否将其发布为答案,以便我接受? 【参考方案1】:
if(navigator.vendor.indexOf('Goog') > -1)
  //Your code here

【讨论】:

【参考方案2】:

这个问题已经在这里讨论过:javascript: How to find out if the user browser is Chrome?

请试试这个:

var isChromium = window.chrome;
if(isChromium)
    // is Google chrome 
 else 
    // not Google chrome 

但更完整和准确的答案是这样,因为 IE11、IE Edge 和 Opera 也会返回 truewindow.chrome

所以使用下面的:

// please note, 
// that IE11 now returns undefined again for window.chrome
// and new Opera 30 outputs true for window.chrome
// but needs to check if window.opr is not undefined
// and new IE Edge outputs to true now for window.chrome
// and if not ios Chrome check
// so use the below updated condition
var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edge") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");

if (isIOSChrome) 
   // is Google Chrome on IOS
 else if(
  isChromium !== null &&
  typeof isChromium !== "undefined" &&
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false
) 
   // is Google Chrome
 else  
   // not Google Chrome 

以上帖子建议使用 jQuery.browser。 但 jQuery API 建议不要使用此方法..(请参阅DOCS in API)。并声明其功能可能会在 jQuery 的未来版本中转移到团队支持的插件中。

jQuery API 推荐使用jQuery.support

原因是 'jQuery.browser' 使用了可以被欺骗的用户代理,并且在以后的 jQuery 版本中它实际上已被弃用。如果你真的想使用 $.browser.. 这是独立 jQuery 插件的链接,因为它已从 jQuery 版本 1.9.1 中删除。 https://github.com/gabceb/jquery-browser-plugin

最好使用特征对象检测而不是浏览器检测。

此外,如果您使用 Google Chrome 检查器并转到控制台选项卡。键入“窗口”并按 Enter。然后您可以查看“窗口对象”的 DOM 属性。折叠对象时,您可以查看所有属性,包括“chrome”属性。

我希望这会有所帮助,尽管问题是如何使用 jQuery。但有时直接使用 javascript 更简单!

【讨论】:

【参考方案3】:

当我测试答案@IE 时,我总是得到“真实”。更好的方法是这也适用于@IE:

var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);

如本答案所述: https://***.com/a/4565120/1201725

【讨论】:

【参考方案4】:

作为快速添加,我很惊讶没有人想到这一点,您可以使用 in 运算符:

"chrome" in window

显然这不是使用 JQuery,但我想我会放它,因为它在您不使用任何外部库的时候很方便。

【讨论】:

【参考方案5】:
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase()); 

if($.browser.chrome)
  ............


更新:(10x 到 @Mr. Bacciagalupe)

jQuery 已从 1.9 及其最新版本中删除了 $.browser

但你仍然可以将 $.browser 作为独立插件使用,发现 here

【讨论】:

@TaylorMac 我不知道为什么它比其他链接好很多,因为我发布的第一个链接在第 5 条评论中有相同的示例,第二个链接也使用相同的技术,但向您展示了如何其他人也被检测到。无论如何,我很高兴你找到了解决方案。 Chromium 在其 User-Agent 中也包含“Chrome”,但为了安全起见,为什么不 /chrom(e|ium)/ :) jQuery api 文档建议反对使用 $.browser。 api.jquery.com/jQuery.browser .. 使用功能检测也比检查可能被欺骗的浏览器用户代理更好。. $.browser 测试用户代理.. jQuery api 说使用 $.support.. 但在这种情况下尝试测试是否窗口.chrome 存在.. 在 IE8 上失败,因为它列出了 chromeframe:mozilla/4.0(兼容;msie 8.0;windows nt 5.1;trident/4.0;chromeframe/25.0.1364.97;.net clr 1.1.4322;.net clr 2.0 .50727;infopath.1;ms-rtc lm 8;.net4.0c;.net4.0e;.net clr 3.0.4506.2152;.net clr 3.5.30729) @Jacob,jQuery 已从 1.9 及其最新版本中删除了 $.browser。但是您仍然可以将 $.browser 用作独立插件,可在此处找到:github.com/gabceb/jquery-browser-plugin【参考方案6】:

由于 Opera 的最新更新 !!window.chrome(以及对窗口对象的其他测试)在 Opera 中的测试返回 true 时很遗憾。

Conditionizr 会为您解决这个问题并解决 Opera 问题:

conditionizr.add('chrome', [], function () 
    return !!window.chrome && !/opera|opr/i.test(navigator.userAgent);
);

我强烈建议使用它,因为以上都不是现在有效的。

这允许你做:

if (conditionizr.chrome) ...

Conditionizr 负责检测其他浏览器,并且比 jQuery hack 更快更可靠。

【讨论】:

【参考方案7】:

用户无尽是对的,

$.browser.chrome = (typeof window.chrome === "object"); 

代码最好用jQuery检测Chrome浏览器。

如果你使用 IE 并添加了 GoogleFrame 作为插件,那么

var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );

代码将被视为 Chrome 浏览器,因为 GoogleFrame 插件修改了 navigator 属性并在其中添加了 chromeframe。

【讨论】:

【参考方案8】:
if(/chrom(e|ium)/.test(navigator.userAgent.toLowerCase()))
 alert('I am chrome');

【讨论】:

这是在 IE Edge 中检测到的【参考方案9】:

userAgent 可以更改。为了更健壮,请使用 chrome 指定的全局变量

$.browser.chrome = (typeof window.chrome === "object");

【讨论】:

【参考方案10】:

虽然它不是 Jquery ,但我自己使用 jquery,但对于浏览器检测,我曾多次使用 this page 上的脚本。它检测所有主要浏览器,然后是一些。这项工作几乎已经为您完成了。

【讨论】:

【参考方案11】:
var is_chrome = /chrome/.test( navigator.userAgent.toLowerCase() );

【讨论】:

以上是关于如何使用 jQuery 检测浏览器是不是是 Chrome?的主要内容,如果未能解决你的问题,请参考以下文章

检测是不是支持事件监听器

使用 JQuery 检测啥浏览器 [关闭]

如何使用 jquery 检测浏览器是 iOS、android 还是桌面?

使用 jQuery 检测 Safari

使用 jQuery.support 检测 IE6

如何使用 jQuery 检测浏览器类型?