在js中检测浏览器的最佳方法

时间:2011-10-09 08:31:37

标签: javascript browser-detection browser-feature-detection

在JavaScript中有很多方法可以检测浏览器。

据我所知,使用navigator.userAgent或检测功能(如XMLHttpRequest)等。

有谁能告诉我哪种方式最好,最有效?

4 个答案:

答案 0 :(得分:16)

如果您确实需要了解他们正在使用的 浏览器 ,您通常需要查看userAgent字符串(尽管您有时可以推断出浏览器通过寻找几个晦涩的功能)。请注意,有些浏览器会让用户更改并骗你。 : - )

但是检测浏览器已经过时了,原因很多。相反,正如您所说,您想要检测您正在寻找的功能。这更可靠,工作量更少。例如,仅仅因为IE不支持addEventListener并不意味着它永远不会(事实上IE9会这样)。因此,您需要使用功能检测功能,以便对代码进行验证。

以下是一个具体示例:假设您想知道(正如我对place5 jQuery plug-in所做的那样)浏览器是否支持placeholder attribute。您可以使用浏览器检测并维护哪些版本具有或不具有支持的浏览器列表,这些浏览器是混乱的,您必须继续回访等等,或者你可以这样做:

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

......你已经完成了。

this page维护的kangax中有很多功能测试。还有一个名为Modernizr的库,可以为您执行功能检测,媒体查询等功能。如果您使用jQuery,它会通过jQuery.support内置一些功能检测。在this article中对特征检测,媒体查询,形状因子检测(平板电脑,手机或PC?)的各个方面进行了很好的讨论。

答案 1 :(得分:6)

您没有检测到浏览器。而是检查可用的功能。

浏览器检测可以解决(地狱......我几年前在gmail上使用opera时自己必须这样做),但如果浏览器有一个功能,那么你知道你可以使用它。

答案 2 :(得分:0)

您可以尝试此http://www.quirksmode.org/js/detect.html

但正如其他人所说,你应该尝试使用特征检测,但有时它还不够。例如,某些功能运行得非常糟糕/缓慢等等。

另一个很棒的功能检测工具是Modernizr

答案 3 :(得分:0)

功能检测是检测浏览器的捷径。如上所列,了解浏览器是否支持某项功能更为重要,而不是检测浏览器。 以下链接将帮助您根据浏览器支持的对象区分浏览器: http://www.javascriptkit.com/javatutors/objdetect3.shtml

但是,如果您只是为了了解而只想检测浏览器,最好使用Navigator,而不是通过检查条件来检查各种功能。