Jquery 支持没有新功能的浏览器

可能重复：

我一直在阅读关于功能检测（使用Google/Wikipedia/Docs）的文章，但没有完全掌握它。出现了一些问题

为什么需要特征检测。我们不能检测浏览器并为其编写代码吗

不同的特征检测方法。他们中最好的

你能给我举一个实际的例子，说明特征检测的工作原理吗。我们如何处理旧浏览器以及如何在其中复制相同的功能>

为什么需要特征检测。我们不能检测浏览器并为其编写代码吗

不，很快你列出的每个浏览器的功能都会过时，而且本质上是不完整的。（三年前的黑莓浏览器是否支持输入中的占位符文本？我不知道，也不需要在意。）例如，过去IE没有

addEventListener

。现在是了。如果您开始一直检测到浏览器版本级别，那么当新版本出现时您会怎么做？这是一场维护噩梦

不同的特征检测方法。他们中最好的

没有单一的特征检测，这取决于特征。你可以找到一个很好的特征检测列表。还有类似的库可以为您进行功能检测

你能给我举一个实际的例子，说明特征检测的工作原理吗。我们如何处理旧浏览器以及如何在其中复制相同的功能>

当然。我在上面给了你们两个，让我们深入研究一下（按相反的顺序）

addEventListener

：这是在不使用jQuery、YUI等库的代码中常见的现象：

if (elm.addEventListener) {
    // Standard
    elm.addEventListener("click", myClickHandler, false);
}
else if (elm.attachEvent) {
    // IE fallback
    elm.attachEvent("onclick", myClickHandler);
}

上述代码的优点在于，当IE9问世并拥有

addEventListener

（在标准模式下）时，代码就正常工作了。不需要更新数据库就可以说“IE9现在拥有它。”

或者输入字段中有占位符文本，例如：

<input type="text" name="firstName" placeholder="First name">

如果没有，您可以自己连接代码来完成。我在place5插件中实现了这一点，它是此功能的polyfill

因为浏览器可能会伪造他们的身份。还因为你永远不可能知道所有可能的浏览器的特性

取决于功能。如果它是一个JavaScript方法，您通常只需如下检查：

If（window.XMLHttpRequest）{alert（'it supporttheXMLHTTP请求！'）；}

。不同的功能可能需要不同的方法来检查它们

使用与前面相同的示例-如果检查返回

false

，您将退回到创建ActiveX对象（如果受支持，则在旧的IE版本上）。或者，您可能会向用户显示一条消息，说明他们将无法在您的应用程序中执行某些操作

---

一些答案，但像往常一样开放供讨论：）

1） 要回答这个问题，只需想想你在野外有多少不同的浏览器及其版本。。。如果您想支持尽可能多的浏览器，则需要为每个浏览器编写不同的代码。。。而通过手机浏览，这些数字会累加起来。拥有“检测”一个特性的能力只允许您编写两段代码，一段用于启用该特性的浏览器，另一段用于其他浏览器

2） 这当然是主观的。我用

---

3） 看看Modernizer可以检测到的功能，您将看到。例如，如果您想在客户端启用地理定位，最好的方法是使用功能检测库，而不是保留自己的浏览器特定代码数据库（这与问题1有关）。通常，为了覆盖未实现的特性，您可以在if-then-else中编写自己的代码，或者使用所谓的poly-fill，您可以阅读相关内容。基本上，它们是实现旧浏览器中不存在的功能的代码片段。其美妙之处在于它们是完全透明的，您只需使用它们，而不必关心它们是否使用了真正的实现或是否依赖于变通方法。这个例子值得一读。

2：没有多种方法可以进行特征检测。只有一个：

if（featureExists）{/*use feature*/}否则{/*fallback solution*/}

@ŠimeVidas-有。你不能用这种方式检查CSS功能。@Knaģ有吗？你能详细说明一下吗？它们是什么？@Knaģ是

if（typeof document.body.style.maxWidth！='undefined'）{…

。我的观点是，设计的特征检测涉及一个if语句。特征检测意味着

if（featureExists）{…

，没有其他方法可以进行功能检测。谢谢你给出了这个很棒的答案！@TomHodder:很高兴！很高兴这有帮助。如果你对JSLint抱怨在中使用

进行属性检查有困难，你可以求助于将此检查包装在一个
eval（）
中（如果你已经告诉JSLint允许的话）或
新函数（…）
。
if ('placeholder' in document.createElement('input')) {
    // Supports the placeholders
}
else {
    // Doesn't, need to do something
}