jQuery不能用或者jQuery没法及时使用的时候,有需要操作节点的className,就可以用这些代码了。
【现代浏览器】
element.classList.add(selector); element.classList.remove(selector); element.classList.toogle(selector);
【支持老浏览器的办法】
var addClass = function(elem, str) {
if (elem.className == str) return
if (elem.className.indexOf(str+' ') > -1) return
if (elem.className.indexOf(' '+str) > -1) return
str = (elem.className == '')?str:' '+str
elem.className += str
elem.className = elem.className.replace(/s{2,}/g, ' ')
}
var removeClass = function(elem, str) {
if (elem.className == str) {
elem.removeAttribute('class')
return
} else if (elem.className.indexOf(str+' ') > -1) {
elem.className = elem.className.replace(str+' ','')
} else if (elem.className.indexOf(' '+str) > -1) {
elem.className = elem.className.replace(' '+str,'')
}
elem.className = elem.className.replace(/s{2,}/g, ' ')
}
【使用方法】
例如:
addClass(document.querySelector('.hello-world'), 'demo')
removeClass(document.querySelector('.hello-world'), 'hello-world')

