JQuery源码阅读2=>has同级

作者: 小遁哥 | 来源:发表于2018-05-06 10:38 被阅读6次

    0.

    大多数JQueryAPI能传入JQ对象的,同样也能传入DOM对象和字符串选择器,三者等价。

    1

    对已有JQ对象进行过滤,返回包含指定元素的集合

    has: function( target ) {
        //传入JQ对象和DOM对象(封装为JQ)不进行查找。
        var targets = jQuery( target, this ),
            l = targets.length;
        //过滤元素
        return this.filter( function() {
            var i = 0;
            for ( ; i < l; i++ ) {
                //是否包含
                if ( jQuery.contains( this, targets[ i ] ) ) {
                    return true;
                }
            }
        } );
    },
    

    返回最近的、符合条件的祖先元素,包括他自己

       //这里的context只能传DOM元素 不知道是不是设计上的失误
      closest: function( selectors, context ) {
        var cur,
            i = 0,
            l = this.length,
            matched = [],
            targets = typeof selectors !== "string" && jQuery( selectors );
    
        // Positional selectors never match, since there's no _selection_ context
        /*
          /^[\x20\t\r\n\f]*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\([\x20\t\r\n\f]*((?:-\d)?\d*)[\x20\t\r\n\f]*\)|)(?=[^-]|$)/i
          不处理需要上下文的选择器 如even|odd  ,类似于eq这样的是可以写入负数的,意味着从后开始计数(负数加上总长度)  
        */
        if ( !rneedsContext.test( selectors ) ) {
            for ( ; i < l; i++ ) {//JQ集合中的每个元素
                for ( cur = this[ i ]; cur && cur !== context; cur = cur.parentNode ) {
            /*
                    不处理DocumentFragment
                    如果是传入JQ对象则通过index($element.index)方法查找cur,否则,通过jQuery.find.matchesSelector判定是否符合指定的选择器,DOM方法有相关实现MatchesSelector 
            */
                    // Always skip document fragments
                    if ( cur.nodeType < 11 && ( targets ?
                        targets.index( cur ) > -1 :
    
                        // Don't pass non-elements to Sizzle
                        cur.nodeType === 1 &&
    
                            jQuery.find.matchesSelector( cur, selectors ) ) ) {
    
                        matched.push( cur );
                        break;
                    }
                }
            }
        }
       //uniqueSort  用于去重
        return this.pushStack( matched.length > 1 ? jQuery.uniqueSort( matched ) : matched );
    },
    

    查找位置

    index: function( elem ) {
    
        // No argument, return index in parent
        /*
            没传参数则查找其在父元素中的位置 
            this.first获取集合中的第一个元素,prevAll获取前面所有的兄弟元素
            
         */
              
        if ( !elem ) {
            return ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll()获得在当前元素前面的兄弟节点的个数
        }
    
        // Index in selector
       //如果传入的是选择器,则进行查询,并调用原生的indexOf(通过call方法改变了环境变量,Array.prototype.indexOf)方法返回当前元素在其的位置
        if ( typeof elem === "string" ) {
            return indexOf.call( jQuery( elem ), this[ 0 ] );
        }
    
        // Locate the position of the desired element
        /*
              elem.jquery 如果elem是JQ对象,则返回版本号  如果传入的是一个JQ对象或是DOM对象则调用原生的  indexOf 判断  返回其在当前元素中的位置
              这一点有点恶心啊!
          */
        return indexOf.call( this,
    
            // If it receives a jQuery object, the first element is used
            elem.jquery ? elem[ 0 ] : elem
        );
    },
    

    将指定JQ集合添加到当前JQ集合

    add: function( selector, context ) {
        //将返回的新集合放入操作栈中=>用于记录JQ库操作过的DOM对象,并将集合包裹为JQ集合
        return this.pushStack(
            //去重
            jQuery.uniqueSort(
                 /*
                      this.get()  JQ集合的原生数组形式  jQuery.merge将第二个参数中的元素放入第一个参数中
                */
                jQuery.merge( this.get(), jQuery( selector, context ) )
            )
        );
    },
    

    将符合条件上一次操作的DOM对象放入当前集合

    addBack: function( selector ) {
    
        //this.prevObject   获得上一次操作的JQ集合
        return this.add( selector == null ?
            this.prevObject : this.prevObject.filter( selector )
        );
    }
    

    人生就是从一个地方到另一个地方

    相关文章

      网友评论

        本文标题:JQuery源码阅读2=>has同级

        本文链接:https://www.haomeiwen.com/subject/hhsjrftx.html