Question

我试图了解jQuery在搜索DOM元素时如何创建返回对象。我已经浏览了消息来源，但我并不完全确定我理解，并且希望有人在这里能给我一些见解。

从我可以收集的内容中读取源代码，在查询jQuery DOM时，jQuery找到匹配的DOM元素，然后使用元素的索引作为新对象的键，将匹配的DOM元素添加为对象。

if ( rsingleTag.test( match[1] ) && jQuery.isPlainObject( context ) ) {
    for ( match in context ) {
       // Properties of context are called as methods if possible
       if ( jQuery.isFunction( this[ match ] ) ) {
             this[ match ]( context[ match ] );    
            // ...and otherwise set as attributes
       } else {
            this.attr( match, context[ match ] );
       }
    }
}    
return this;

返回this，返回包含所有方法的整个jQuery对象。我是否正确到了这一点？

现在，它出现了所有的功能，如css，find，ajax，hide等。在jQuery.fn对象中。

不知何故（而且我认为这是我没有看到它的地方），这些函数被调用，而不是在DOM元素本身上，而是通过access.js https://github.com/jquery/jquery/blob/master/src/core/access.js

var access = jQuery.access = function( elems, fn, key, value, chainable, emptyGet, raw ) {

以css为例，我们有

jQuery.extend({
    css: function( elem, name, extra, styles ) {...

jQuery.fn.extend({
css: function( name, value ) {
        return access( this, function( elem, name, value ) {
            var styles, len,
                map = {},
                i = 0;

            if ( jQuery.isArray( name ) ) {
                styles = getStyles( elem );
                len = name.length;

                for ( ; i < len; i++ ) {
                    map[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles );
                }

                return map;
            }

            return value !== undefined ?
                jQuery.style( elem, name, value ) :
                jQuery.css( elem, name );
        }, name, value, arguments.length > 1 );

我认为我缺少的是我们如何从调用$('div').css(...)调用jQuery.fn.extend.css方法，并从那里调用具有不同签名的访问方法在核心jQuery中初始化的访问方法？

另外，如果我们不断更换jQuery[0],jQuery[1]，我可以拥有它：

var divs = $('div');
var spans = $('span');

如果它们都返回相同的jQuery对象，那么维护两组不同的文档标记？我以为该对象会更新。

我是否完全误解了这一切是如何运作的？

Answer 1

从查询源代码时，我可以收集查询jQuery DOM，jQuery找到匹配的DOM元素，然后添加匹配的DOM 元素作为对象使用元素的索引作为键新对象。

是。 jQuery实例基本上是类似于数组的对象。

if ( rsingleTag.test( match[1] ) && jQuery.isPlainObject( context ) ) {
    for ( match in context ) {
       // Properties of context are called as methods if possible
       if ( jQuery.isFunction( this[ match ] ) ) {
             this[ match ]( context[ match ] );    
            // ...and otherwise set as attributes
       } else {
            this.attr( match, context[ match ] );
       }
    }
}    
return this;

但这不是代码中引用部分的内容。你在这里看到的是处理jQuery(html, attributes) signature的代码 - 当第二个参数是一个对象而第一个是独立的html标签时，然后调用相应的方法或在新集合上设置属性（this ）。

返回此，返回包含的整个jQuery对象所有的方法。现在，它出现了所有的功能，如css，find，ajax，hide等。在... jQuery.fn对象。

是。 jQuery构造函数返回的对象确实从$.fn prototype object继承了这些方法。

不知何故（我认为这是我没有看到的地方），这些功能不是在DOM元素本身上调用，而是通过access.js调用 https://github.com/jquery/jquery/blob/master/src/core/access.js

access只是一个内部帮助函数。所有jQuery方法都在jQuery实例上调用。

以css为例，我们有

jQuery.extend({
    css: function( elem, name, extra, styles ) {...

jQuery.css()只是一个＆＃34;静态＆＃34;，内部帮助函数，用于获取计算的css值。没有什么是你自己直接使用的。

jQuery.fn.extend({
    css: function( name, value ) {
        return access( this, function( elem, name, value ) {
            …
        }, name, value, arguments.length > 1 );
    }
我认为我失踪的是我们是如何从打电话中获得的调用jQuery.fn.extend.css方法的$（＆＃39; div＆＃39;）。css（...）

没有jQuery.fn.extend.css方法。对jQuery.fn.extend()的调用确实定义 jQuery.fn.css方法。这就是你所说的方法 - 它由$('div')原型继承。

从那里，使用不同的签名调用访问方法在核心jQuery中初始化的访问方法？

不，你为什么这么想？

// the signature:
access = function( elems, fn, key, value, chainable, emptyGet, raw )
// the call:
access( this, // array-like collection
        function(…){…}, // callback
        name, // string
        value, // whatever
        arguments.length > 1 // boolean whether it's a getter
        // undefined, implicit
        // undefined, implicit
      )

另外，如果我们不断更换jQuery [0]，jQuery [1]

不，我们不是吗？你在哪里看到的？

我怎么能拥有：var divs = $('div'); var spans = $('span'); 如果它们都是两个，则维护两组不同的文档标记返回相同的jQuery对象？

他们不是。这两个调用都会创建新的jQuery实例。

我认为该对象会更新。

不，jQuery实例非常不可变。

理解jQuery返回对象

1 个答案: