在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
}

如果 class 不存在任何元素selector，jQuery 将不会绑定任何东西。