javascript - How to implement jq's addclass and removeclass in js. For example, it is originally class="aa" and needs to be changed to class="aa bb"

Question

How to implement jq's addclass and removeclass in js. For example, it is originally class="aa" and it needs to be changed to class="aa bb". Be careful not to use jquery

Answer 1

js has a classlist interface
MDN link

But you have to consider compatibility.

Answer 2

replace

Answer 3

if (!this.hasClass(obj, class)) obj.className += " " + class;

Answer 4

elem.className
or
elem.classList
I feel classList is better, elem.classList.add('bb') will do
In addition, the jQuery source code implements addClass and removeClass through className
Finally, this bias For basic questions, you need to learn how to Baidu and Google yourself

Answer 5

function addClass(ele,name){
        if(ele && name){
            var cn = ele.className;
            if(!cn){
                ele.className = name;
            }else if(cn.indexOf(name) === -1){
                ele.className = cn.replace(/\s*$/,' '+name);
            }
        }
}
function removeClass(ele,name){
        var reg1 = new RegExp('^\\s*\\b'+ name +'\\b\\s*$');
        var reg2 = new RegExp('^\\s*' + name+'\\b');
        var reg3 = new RegExp('\\b'+ name + '\\s*$');
        var reg4 = new RegExp('\\s*\\b'+name+'\\b\\s*');
        if(ele && name){
            var cn = ele.className;
            if(cn && cn.indexOf(name) > -1){
                if(reg1.test(cn)){
                    ele.className = '';
                }else if(reg2.test(cn)){
                    ele.className = cn.replace(reg2,'');
                }else if(reg3.test(cn)){
                    ele.className = cn.replace(reg3,'');
                }else{
                    ele.className = cn.replace(reg4,' ');
                }
            }
        }
};