在jQuery中，在尝试绑定事件处理程序之前检查元素是否存在更快吗？

Question

首先检查元素是否存在更快，然后绑定事件处理程序，如下所示：

if( $('.selector').length ) {
    $('.selector').on('click',function() {
          // Do stuff on click
    }
}

或者只是做得更好：

$('.selector').on('click',function() {
     // Do stuff on click
}

所有这些都发生在文件就绪，所以延迟越少越好。

Answer 1

编写if检查的更好方法就是这样

var elems = $('.selector');
if( elems.length ) {
    elems.on('click',function() {
          // Do stuff on click
    });
}

因此，让我们测试一下，看看代码告诉我们的内容 http://jsperf.com/speed-when-no-matches

最后你说的是几毫秒的差异，而非if检查在运行一次时不会引人注意。当有元素要查找时，这也没有考虑到，在这种情况下，如果检查有额外的元素。这会检查重要吗

让我们看看他们何时找到元素http://jsperf.com/speed-when-has-matches

真的没什么区别。因此，如果您想节省一毫秒的分数，请执行if。如果你想要更紧凑的代码，那就把它留给jQuery方式吧。最后它做了同样的事情。

Answer 2

只需使用

$('.selector').on('click',function() {
     // Do stuff on click
}

如果类selector中不存在任何元素，则jQuery将不会绑定任何内容。

Answer 3

$('.selector').on('click',function() { // Do stuff on click } 如果元素存在则绑定，否则不绑定。所以这更快。

Answer 4

直接使用绑定。

$('selector').on('click',function() {
    // Do stuff on click
}

如果没有指定选择器的元素，它将不会做任何事情 - 甚至不发布错误，这意味着对元素的实际检查将执行两次相同的操作。我不会简单地将它称为元素存在的检查，但是在jQuery中实现它的方式当然就是这样。