This article analyzes the removeClass() method of jQuery source code interpretation in more detail. Share it with everyone for your reference. The specific analysis is as follows:
The removeClass() method is not much different from addClass(). Let’s take a look:
jQuery.fn.extend({
removeClass: function( value ) {
var classes, elem, cur, clazz, j, finalValue,
i = 0,
len = this.length,
proceed = arguments.length === 0 || typeof value === "string" && value;
if ( jQuery.isFunction( value ) ) {
return this.each(function( j ) {
//Here is the class name returned by the function you passed to remove the class name, and removeClass itself is called again.
jQuery( this ).removeClass( value.call( this, j, this.className ) );
});
}
if ( proceed ) {
classes = ( value || "" ).match( rnotwhite ) || [];
for ( ; i < len; i ) {
elem = this[i];
Cur = elem.nodeType === 1 && ( elem.className ?
( " " elem.className " " ).replace( rclass, " " ) :
""
);
If ( cur ) {
j = 0;
While ((Clazz = Classes [J]) {
//The difference is in the while loop below. When the current DOM element is retrieved and contains the class name you want to remove, replace will be used to replace it with " "
While (Cur.indexof ("Clazz") & GT; = 0) {
Cur = cur.replace( " " clazz " ", " " );
}
}
//The following is also one of the key differences, to determine whether you have passed the value of the class name to be removed. If not passed, finalValue="", if the DOM element has a class name at this time, that is, the condition is true, remove all class names of the DOM element;
//If passed, remove the matching class name. After removal, the class names that have not been removed are spliced into cur, the space strings at the left and right ends are removed, and the class name of the DOM element is set to cur.
finalValue = value ? jQuery.trim( cur ) : "";
If ( elem.className !== finalValue ) {
to
}
}
}
}
return this;
}
});
I hope this article will be helpful to everyone’s jQuery programming.