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

Question

我有一个存储在变量中的jQuery选择器,如下所示:

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

我想知道是否以及如何使用此变量来选择此元素的子元素,而不是写入:

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

我该怎么做呢？

我也想知道如果我使用缓存选择器获得一些性能优势,即使我将其与其他选择器一起扩展？

Answer 1

您可以在jQuery的对象返回上使用find()来获取变量中对象的后代.

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

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

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

使用兑现对象可以提供更好的性能,但可能很少注意到它.您可以使用此jspref网站来比较性能.

jspref的现场表演测试

我已经进行了实时jspref测试,用于比较使用parent作为对象和使用parent in selector的选择器性能.此测试显示了第一种方法,如果我们首先获取对象中的父级并使用find获取后代,那么父级后代选择器的速度要慢大约28%.