前言：

　　年后换了工作，在现在的公司写交互主要使用JS原生；刚刚入门前端的时候写交互一直用的原生JS，虽然用的不怎么样。后来去之前的公司之后，leader主张把jQuery用好，JS原生自然就熟练了；一路下来，jQuery用的比较熟练了，但是原生JS反而退步了，很久没用，有的东西都有点手生了；现在的公司用原生JS也挺好的，感觉现在很多新的技术也都基于JS原生；

　　做了两个项目，其中对class的DOM操作挺多的，在网上看了很多资料，在别人的基础上总结封装了几个经常用到的函数：getByClass、addClass、removeClass、hasClass；

　　原理看看代码，如果不懂看看注释也就没什么大问题。但是，有时候原理看懂了，自己不动手去做一下，就不会发现自己的问题；容易看懂，但是自己不会写；所以还的多动手~

　　下面是几个函数具体的代码：

//获取classfunction getByClass(oParent, sClass){       if(oParent.getElementsByClassName){        return oParent.getElementsByClassName(sClass);    }else{        var res = [];        var re = new RegExp(' ' + sClass + ' ', 'i')        var aEle = oParent.getElementsByTagName('*');        for(var i = 0; i < aEle.length; i++){            if(re.test(' ' + aEle[i].className + ' ')){                res.push(aEle[i]);            }       }    return res;    }}//增加classfunction addClass(obj,cls) {    var obj_class=obj.className,//获取class的内容；    blank = ( obj_class != '' ) ? ' ' : '';//判断获取的class是否为空，如果不为空，则添加空格；    added = obj_class + blank + cls;//组合原来的class和需要添加的class，中间加上空格；    obj.className = added;//替换原来的class；}//移除classfunction removeClass(obj,cls){    var obj_class = '' + obj.className + '';//获取class的内容，并在首尾各加一个空格；'abc    bcd' -> ' abc    bcd '    obj_class = obj_class.replace(/(\s+)/gi,' ');//将多余的空字符替换成一个空格；' abc    bcd ' -> ' abc bcd '    removed = obj_class.replace(' '+cls+' ',' ');//在原来的class，替换掉首尾加了空格的class  ' abc bcd ' -> 'bcd '    removed = removed.replace(/(^\s+)|(\s+$)/g,'');//去掉首尾空格；'bcd ' -> 'bcd'    obj.className = removed;//替换原来的class；}//判断是否存在classfunction hasClass(obj,cls){    var obj_class = obj.className,//获取class的内容；    obj_class_lst = obj_class.split(/\s+/);//通过split空字符将cls转换成数组    x = 0;    for(x in obj_class_lst){        if ( obj_class_lst[x] == cls ) {            return true;        }    }    return false;}

　　注：1.还是得在工作项目、学习中不断的积累这些经验，经常用到的东西自己封装一个库比较方便；

　　　　2.这些函数最好放在页面底部，特别是getByClass;因为根据页面的加载顺序，会先加载JS，如果写在body前面，会先运行getByClass，后面的内容还没加载，就会出现找不到class的情况，出现报错；