封装addClass,removeClass

jq里面对元素添加class,删除class已经有了很方便的方法。但如果不想用jq呢?
那么可以直接封装一个。过程就不多说了,直接上代码

1
2
<div id="div" class="a">3434344444</div>
<div id="div2" class="a b">3434344444</div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
var oDiv = document.getElementById('div');
var oDiv2 = document.getElementById('div2');

addClass(oDiv,'box');
removeClass(oDiv2,'b');

function addClass(obj,className){
// 如果原来没有class
if( obj.className == '' ){
obj.className = className;
}else{
// 如果原来有class
var arrClassName = obj.className.split(' ');
var _index = arrIndexOf( arrClassName,className );
if( _index == -1 ){
// 如果要添加的class在原来的class中不存在
obj.className += ' ' + className;
}else{
// 如果要添加的class在原来的class中存在
// 啥事不用做
}


}
}
function removeClass(obj,className){
// 如果原来有class
if(obj.className != ''){
var arrClassName = obj.className.split(' ');
var _index = arrIndexOf( arrClassName,className );
if(_index != -1){
arrClassName.splice(_index,1);
obj.className = arrClassName.join(' ');
}
//obj.className = ''
}
}
function arrIndexOf(arr,v){
for(var i=0;i<arr.length;i++){
if(arr[i] == v){
return i;
}
}
return -1;
}