关于jQuery源代码的问题(addClass)

前端之家收集整理的这篇文章主要介绍了关于jQuery源代码的问题(addClass)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
你能解释一下addClass里面的“if(jQuery.isFunction(value))”中的以下逻辑吗?我不明白它的目的是什么.谢谢.
addClass: function( value ) {

        var classNames,i,l,elem,setClass,c,cl;

        if ( jQuery.isFunction( value ) ) {
            return this.each(function( j ) {
                jQuery( this ).addClass( value.call(this,j,this.className) );
            });
        }

        if ( value && typeof value === "string" ) {
            classNames = value.split( rspace );

            for ( i = 0,l = this.length; i < l; i++ ) {
                elem = this[ i ];

                if ( elem.nodeType === 1 ) {
                    if ( !elem.className && classNames.length === 1 ) {
                        elem.className = value;

                    } else {
                        setClass = " " + elem.className + " ";

                        for ( c = 0,cl = classNames.length; c < cl; c++ ) {
                            if ( !~setClass.indexOf( " " + classNames[ c ] + " " ) ) {
                                setClass += classNames[ c ] + " ";
                            }
                        }
                        elem.className = jQuery.trim( setClass );
                    }
                }
            }
        }

        return this;
    },

解决方法

看一下 API page.你会看到有一种方法可以调用addClass来传递函数作为第一个参数.该函数接收该元素并返回要添加的类名:

A function returning one or more space-separated class names to be added. Receives the index position of the element in the set and the old class value as arguments. Within the function,this refers to the current element in the set.

所以你可以这样做:

$('.someElements').addClass(function(i,currentClass) {
    return 'newClass' + i;
});

选择的第一个元素将添加newClass0类,第二个newClass1等.

使用您发布的代码

if (jQuery.isFunction(value)) {
    return this.each(function (j) {
        jQuery(this).addClass(value.call(this,this.className));
    });
}

这说:

>如果第一个参数是函数>循环选择所有元素>对于每个函数,使用元素作为上下文(this值)调用函数,将循环中的位置作为第一个参数,将className属性作为第二个参数调用.>然后使用步骤#3的结果调用addClass方法.

原文链接:https://www.f2er.com/jquery/175801.html

猜你在找的jQuery相关文章