Question

你能解释一下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;
    },

Answer 1

查看API page。您将看到有一种方法可以调用addClass将函数作为第一个参数传递。该函数接收元素并返回要添加的类名：

返回一个或多个要添加的空格分隔的类名的函数。接收集合中元素的索引位置和旧类值作为参数。在函数内，this引用集合中的当前元素。

所以你可以这样做：

$('.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, j, this.className));
    });
}

这说：

如果第一个参数是函数
遍历所有选定的元素
对于每个函数，使用元素作为上下文（this值）调用函数，将循环中的位置作为第一个参数，将className属性作为第二个参数调用。
然后使用步骤＃3的结果调用addClass方法。

Answer 2

看看文档，里面可以有一个函数。

.addClass（function（index，currentClass））功能（索引， currentClass）返回一个或多个空格分隔类的函数要添加的名称。接收元素中的索引位置 set和旧类值作为参数。在功能内，这个指的是集合中的当前元素。

Answer 3

在API中对此进行了解释。它用于测试传递的参数是否是一个返回空格分隔的类列表

的函数

Answer 4

您可以在.addClass（）函数中使用函数，如：

$(document).ready(function() {
    $("li").addClass(function(i) {
        return "li" + i;
    });
});

Answer 5

试试这个

 function addClass(elem, className) {
        if (!hasClass(elem, className)) {
            elem.className += ' ' + className;
        }
    }

关于jQuery源代码的问题（addClass）

5 个答案: