This article will share with you the function of adding and removing javascript class names. For more information about how to add and remove javascript class names, see this article.
Method 1: Use the className attribute;
Method 2: Use the classList API;
// Function reg (name) {return new RegExp ('(^ | \ s)' + name + '(\ s + | $) ');} // hasClass addClass removeClass toogleClassvar hasClass, addClass, removeClass; if ('classlist' in document.doc umentElement) {hasClass = function (obj, cname) {return obj. classList. contains (cname) ;}; addClass = function (obj, cname) {obj. classList. add (cname) ;}; removeClass = function (obj, cname) {obj. classList. remove (cname) ;}; toggle Class = function (obj, cname) {obj. classList. toggle (cname) ;};} else {hasClass = function (obj, cname) {return reg (cname ). test (obj. className) ;}; addClass = function (obj, cname) {if (! HasClass (obj, cname) {obj. className = obj. className + ''+ cname ;}; removeClass = function (obj, cname) {obj. className = obj. className. replace (reg (cname), '') ;}; toggleClass = function (obj, cname) {var toggle = hasClass (obj, cname )? RemoveClass: addClass; toggle (obj, cname) ;}}// truedocument. body. classList. toString () === document. body. className;
Note:This method can only pass one class name at a time and cannot perform cascade operations. Similar operations under jquery can operate on multiple class names.
So let's expand it:
//addClassDOMTokenList.prototype.addClass=function(str){ tts.split(' ').forEach(function(c){ this.add(c); }.bind(this)); return this;}//removeClassDOMTokenList.prototype.removeClass=function(str){ tts.split(' ').forEach(function(t){ this.remove(t); }.bind(this)); return this;}//removeClassDOMTokenList.prototype.toggleClass=function(str){ tts.split(' ').forEach(function(t){ this.toggle(t); }.bind(this)); return this;}
The above is the detailed content shared by the implementation code for adding and removing JavaScript class names. For more information, see other related articles in the first PHP community!