JavaScript中检测浏览器的最佳方法

Question

有很多种JavaScript浏览器检测的方法。

据我所知，使用navigator.userAgent或检测功能（如XMLHttpRequest）等。

有人能告诉我哪种方式最好、最有效吗？

- vikingmute

---

使用 http://www.modernizr.com/ 来检测特性。 - Idered

Answer 1

如果你真的需要知道用户使用的浏览器，大多数情况下你需要查看userAgent字符串（尽管有时候你可以通过查找一些不常见的特性来推断浏览器）。只需注意，某些浏览器允许用户更改该字符串并欺骗你。 :-)

但是检测浏览器已经过时了，有很好的理由。相反，如你所说，你想要检测你正在寻找的特性。这更可靠，也更省事。例如，即使IE不支持addEventListener，也不能说明它永远不会支持（事实上，IE9就支持）。因此，你应该进行特性检测，这样代码就具有未来兼容性。

以下是一个具体的例子：假设你想知道（就像我为我的place5 jQuery插件所做的那样），浏览器是否支持placeholder属性。你可以使用浏览器检测，并维护一个列表，其中包含哪些版本的浏览器支持或不支持该属性，这很麻烦，而且你必须不断地回来查看等等，或者你可以这样做：

if ("placeholder" in document.createElement("input")) {
    // The browser supports the attribute
}
else {
    // It doesn't
}

完成后，您就完成了。

这个页面中维护了一组很棒的功能测试，由kangax维护。还有一个名为Modernizr的库可为您执行功能检测、媒体查询等操作。如果您使用jQuery，则它通过jQuery.support内置了一些功能检测。这篇文章中对功能检测、媒体查询、设备类型检测（平板电脑、手机或PC？）的各个方面进行了详细讨论。

- T.J. Crowder

---

正是我所需要的！检测IE9及以下版本。 - vsync

@T.J. Crowder - 同意选择功能检测，但如果您正在尝试检测浏览器以解决错误呢？一个错误，您无法进行测试，否则它会挂起浏览器？ - johntrepreneur

@T.J. Crowder - 除了我之前的问题，我需要找到IE9到IE7浏览器的好方法，并且基于您对特性检测的评论，一个好的合法方法是使用条件注释（支持直到IE9）来设置变量。对吗？ - johntrepreneur

@johntrepreneur：如果那是你想要做的唯一方式，为什么不呢？但是请确保查看kangax的页面等相关信息。确实有一些东西是无法进行特性检测的，但并没有我原先想象的那么多... :-) - T.J. Crowder

有时候你需要检测浏览器。比如说，我正在开发一个使用webGL的网站，所以我们要检测它是否可用。如果不可用，我需要提供一个特定于浏览器的消息（具体来说是一组在Safari上启用webGL的指令）。 - Max Strater

Answer 2

你不需要检测浏览器，而是要检查可用的功能。

浏览器检测可以被规避（我几年前在使用Opera登录Gmail时就不得不这么做），但如果浏览器具有某个功能，则您知道可以使用它。

- tereško

---

有时候你需要知道具体的浏览器类型，这样你就可以提供特定于浏览器的信息。 - Max Strater

在我的情况下，是关于在Safari中启用WebGL的指令。 - Max Strater

检测webGL功能，如果不存在，则显示特定于浏览器的消息（更新您的IE，这是如何启用webGL等）。 - Max Strater

Answer 3

你可以尝试这个http://www.quirksmode.org/js/detect.html 但是正如其他人所指出的，你应该尝试使用特性检测，但有时候这还不够。例如当某些特性工作得太差/慢等等。

另一个很棒的特性检测工具是Modernizr。

- esamatti

Answer 4

特征检测是检测浏览器的捷径。如已列出，更重要的是知道您的浏览器是否支持某个功能，而不是检测浏览器。 以下链接将帮助您根据它们支持的对象区分浏览器： http://www.javascriptkit.com/javatutors/objdetect3.shtml

然而，如果您只想检测浏览器以了解情况，最好使用Navigator而不是通过检查条件来检查各种功能。

- MSeth