是jQuery（'。foo'）。find（'。bar'）等同于jQuery（'。bar'，jQuery（'。foo'））？

Question

使用：

var $a = $('.foo').find('.bar');

var $b = $('.bar', $('.foo'));

我知道$b的上下文设置为$('.foo')，而$a。除此之外，我相信这两个对象是一样的，对吗？

跟进Qs：

1. 由于搜索是否有效地根据同一个对象，因此性能是否相同？
2. 根据核心jquery操作，更严格的上下文是否会提高性能？ （我知道它的目的是用于插件使用。）

谢谢！

Answer 1

修改

是的，它们是等价的，这是源

// HANDLE: $(expr, [context])
// (which is just equivalent to: $(content).find(expr)
} else
    return jQuery( context ).find( selector );

要有效地使用上下文，它必须是HTMLElement，否则上下文是document

find()在jQuery 1.3.2

中实现

find: function( selector ) {
    if ( this.length === 1 ) {
        var ret = this.pushStack( [], "find", selector );
        ret.length = 0;
        jQuery.find( selector, this[0], ret );
        return ret;
    } else {
        return this.pushStack( jQuery.unique(jQuery.map(this, function(elem){
            return jQuery.find( selector, elem );
        })), "find", selector );
    }
}

find()使用Sizzle选择器引擎执行实际的查找工作（请查看jQuery源代码中的第2364行）。

和pushStack是

// Take an array of elements and push it onto the stack
// (returning the new matched element set)
pushStack: function( elems, name, selector ) {
    // Build a new jQuery matched element set
    var ret = jQuery( elems );

    // Add the old object onto the stack (as a reference)
    ret.prevObject = this;

    ret.context = this.context;

    if ( name === "find" )
        ret.selector = this.selector + (this.selector ? " " : "") + selector;
    else if ( name )
        ret.selector = this.selector + "." + name + "(" + selector + ")";

    // Return the newly-formed element set
    return ret;
}

Brandon Aaron撰写了一篇关于understanding the context in jQuery

的精彩文章

Answer 2

是的，结果会是一样的。性能也应该是相同的，但这就是测试的目的！

生成的jQuery对象上有一个属性，它显示用于查找匹配项的选择器。在调试器中查看它。它们在两种方法之间甚至可能是相同的。