js 类名class增删改查

增

document.getElementsByTagName('body')[0].className = 'snow-container'; //设置为新的
document.getElementsByTagName('body')[0].className += 'snow-container'; //在原来的后面加这个
document.getElementsByTagName('body')[0].classList.add("snow-container"); //与第一个等价
document.getElementsByTagName('body')[0].className.concat('snow-container');

删

document.getElementById("id").className.replace('pat',"")
document.getElementById("id").classList.remove("pat");

改

document.getElementById("id").className.replace('pat','pad');

查

document.getElementById("id").getAttribute('class');

原生主要有三种方法：

1、className

var DomClass = document.getElementById("id").className;
//删除 pat
DomClass = DomClass.replace('pat',"");
document.getElementById("id").className = DomClass;

//添加 pad
DomClass = DomClass.concat('pat');
document.getElementById("id").className = DomClass;

//替换 pad
DomClass = DomClass.replace('pat',"pad");
document.getElementById("id").className = DomClass;

2、es5的classList

var DomClass = document.getElementById("id");
//删除 pat
DomClass.classList.remove("pat");

//添加 pad
DomClass.classList.add("pat");

3、同一 setAttribute

var DomClass = document.getElementById("id").getAttribute('class');
//删除 pat
DomClass = DomClass.replace('pat',"");
document.getElementById("id").setAttribute('class',DomClass);

//添加 pad
DomClass = DomClass.concat('pat');
document.getElementById("id").setAttribute('class',DomClass);

//替换 pad
DomClass = DomClass.replace('pat',"pad");
document.getElementById("id").setAttribute('class',DomClass);