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

【问题标题】：should I test whether a target element exists before I bind a function to it?我应该在将函数绑定到目标元素之前测试它是否存在吗？
【发布时间】：2011-03-27 04:24:05
【问题描述】：

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

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

【问题讨论】：

标签： jquery html

【解决方案1】：

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

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

【讨论】：

它并没有真正导致任何减速？我的意思是，如果我首先测试目标元素是否存在，代码会执行更快，还是整体性能相同？
我不完全确定，但如果你只是通过 id 进行简单的选择，你应该没问题 - 在我看来，开销太小，你无法尝试优化它。另一方面，如果您有非常复杂的选择器，则需要 jQuery 时间来遍历 DOM 并找到所有元素，这样您就可以投入精力和改进。但通常情况下，这是值得的。
@RIMMER：要测试它是否存在，无论如何都必须完成所涉及的最慢操作（查找），所以我倾向于认为这无关紧要。现在，如果您在页面上放置一个变量来告诉自己是否要连接它，这可能会不知不觉地更快，但它会在变量和元素的存在不同步的地方自找麻烦。

【解决方案2】：

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

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

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

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

但是，如果您在检查元素是否存在的过程中执行更多代码，则可能更有意义。

【讨论】：

【解决方案3】：

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

如果那个元素，比如#newsletter，在DOM中不存在，那么jQuery将跳过绑定你的函数并且不会抛出任何异常。使用 jQuery 是 100% 安全的。

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

希望能说清楚。

【讨论】：