如何扩展存储在变量中的 jQuery 选择器？

Question

我有一个 jQuery select 或者存储在一个变量中，像这样：

var myVariable = $( ".js-selector" );

我想知道是否以及如何将此变量用于此元素的 select 个子元素，而不是编写：

$( ".js-selector .some-child" );

我该怎么做？

我还想知道是否可以通过使用缓存 select 获得一些性能优势，或者即使我使用其他一些 select 扩展它？

Answer 1

您可以通过 jQuery 在对象 return 上使用 find() 来获取您在变量中拥有的对象的后代。

var descendants = myVariable.find(".some-child");

还有一种语法可以通过使用选择器 jQuery( selector [, context ] ) 传递上下文来使用。虽然这已转换为查找调用，但最好使用上面的调用。

var descendants = $(".some-child", myVariable);

使用 cashed 对象会给你更好的性能，但你可能很少注意到它。您可以使用此 jspref 网站比较性能。

Live performance test on jspref

我已经进行了实时 jspref 测试，用于比较使用父对象作为对象和在选择器中使用父对象的选择器性能。该测试显示了第一种方法，如果我们先获取对象中的父项并使用 find 获取后代，那么父后代选择器的速度大约慢 28%。