Jquery选择器性能和行为

Question

我有一个关于jquery选择器行为的奇怪问题.

第一种方法:

$('#div').find('#something').html('hahah');
$('#div').find('#something').html('hahah');
$('#div').show();

第二种方法:

var $div = $('#div');
$div.find('#something').html('hahah');
$div.find('#something').html('hahah');
$div.show();

我知道它可能没有太大的区别,但是第二个比第一个更快？我一直使用第二种方法,但我不确定是否存在差异,因为我不知道jquery选择器算法是如何工作的.

Answer 1

第二种方式更快/更好,因为你已经缓存了选择器.

每次调用时$('selector'),都会调用jQuery选择器引擎(sizzle)来定位所需的元素.

但是,当您将它们存储在变量中时,您不需要在存储结果时重复调用选择器引擎.

请注意,在上面的示例中,还可以通过存储find()结果来进一步改进缓存

var $something = $('#div').find('#something');
$something.html('hahah');
$something.html('hahah');
$something.show();