5、操作CSS

5-1 classList

classList 属性返回元素的类名，作为 DOMTokenList 对象。
该属性用于在元素中添加，移除及切换 CSS 类

5-2 add() 添加类 remove() 删除类

 js           jquery
add()       addClass()
remove()    removeClass()

<p id="app">hello world</p>
<button id="btn">移除Class</button>
var app = document.getElementById("app")
var btn = document.getElementById("btn")
app.onclick=function(){
  this.classList.add("current")
}
btn.onclick = function(){
  app.classList.remove("current")
}

3-3-3 toggle( ) 切换 contains( ) 判断是否包含某个class

  js         jquery
toggle    toggleClass()
contains  hasClass()  判断是否包含某个class

<p id="app">hello world</p>
var app = document.getElementById("app")
app.onclick = function(){
  /* if(this.classList.contains("current")){
         this.classList.remove("current")
     }else{
         this.classList.add("current")
  } */
  this.classList.toggle("current")
}