JS原生addClass、removeClass实现

用jQuery的addClass（）、removeClass（）时手痒，想了解下原生JavaScript是怎么实现的这类功能。
方法一：还是用到了其他函数辅助，所以看着简短些。

function addClass(ele,classname){
        ele.className += " " + classname;//
    };
function removeClass(ele,classname){
         ele.className = ele.className.replace(classname,"");
    }

思路:采用replace()的替换功能实现删除.
关于replace()详细参见http://www.w3school.com.cn/jsref/jsref_replace.asp

方法二:利用基础JavaScript,不采用其他函数实现

    //为元素添加新classname
    function addClassName(ele,classname){
     //判断以前是否为有class
        if(!ele.className){
            ele.className = classname;
        }else{
            newclassname = ele.className;
            newclassname += " ";
            newclassname += classname;
            ele.className = newclassname;
        }
    }
    //原生JavaScript不使用其他内部封装好的函数比较难以实现删除class,以下方法不适用于直接删除在行内设置了class的情况.一般在做鼠标事件时通过JS添加的class,可以通过数组,先把行内class储存在数组,然后需要时,在用这个储存好的数组在需要的时候更新.

var arrClassName=[];
   //初始化其他兄弟元素的classname
        function updateClassName(ele){
            for(var i = 1;i < ele.parentNode.childNodes.length;i += 4){
                ele.parentNode.childNodes[i].className = arrClassName[i];
            }
        }

转载于:https://www.cnblogs.com/6long/p/6044504.html