Jquery选择器性能＆amp;行为

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();