我应该在将函数绑定到目标元素之前测试目标元素是否存在？

Question

这是一个非常简单的问题。想象一下，在我的网页的索引上，有一个元素，我们称之为#newsletter，它有一个绑定到它的jquery事件。我的网站的其他子页面上不存在此元素。 现在，在我的javascript文件中，我应该仅将绑定限制为元素存在时（用户在索引上），还是jquery自动执行此操作？

实际上，我现在拥有的是：在我的.js文件中，函数绑定到所有子页面上的该元素，即使该元素不存在。这是一个问题吗？

Answer 1

从错误的角度来看，这不会是一个问题，因为如果没有元素与你指定的选择器匹配，jQuery不会抛出异常等。

但是，这可能是一个性能问题，具体取决于您的选择器表达式的复杂程度以及您在没有这些元素的页面上进行的其他多个此类jQuery调用。如果它很多，您可能希望进一步拆分JS脚本，并且每页只加载相关的脚本。

Answer 2

您不会收到任何错误，因为jQuery中的选择器无效。它只是不会为它分配事件处理程序。

至于性能，它应该无关紧要，因为如果你想做这样的事情，无论如何都会解析选择器......

var element = $('#some .complex selector:first > :last-child');

if (element.length) {
   element.click(doIt);
}

但是，如果你在检查中为元素的存在做了更多的代码，那可能会更有意义。

Answer 3

使用jQuery时，无需检查元素是否存在。您可以将任何函数/事件绑定到任何元素，并且当DOM中存在该元素时，这些函数将起作用。

如果该元素（例如#newsletter）在DOM中不存在，那么jQuery将跳过绑定您的函数并且不会抛出任何异常。使用jQuery时，它是100％安全的。

当你在jQuery中使用选择器时，它实际上返回一个jQuery对象，而不是一个javascript元素。您的事件被绑定到jQuery对象。

希望能说清楚。