html5為每一個(gè)元素新增了一個(gè)
classList對(duì)象，classList對(duì)象保存著控制當(dāng)前元素類名的各個(gè)方法和屬性跃脊。
Element.classList是一個(gè)只讀屬性，返回一個(gè)元素的類屬性的實(shí)時(shí) 返回一個(gè)元素的類屬性的實(shí)時(shí)DOMTokenList集合萄涯。
相比將 element.className 作為以空格分隔的字符串來使用陈肛，classList 是一種更方便的訪問元素的類列表的方法。
length返回類名的個(gè)數(shù)
add()在原有的類名基礎(chǔ)上添加一個(gè)類名
remove()在原有的類名基礎(chǔ)上 移出某一個(gè)類名
toggle()如果有這個(gè)類名 則刪除這個(gè)類名楞黄，如果沒有 則添加減去
item()根據(jù)索引 獲取類名
contains()判斷元素是否包含某一個(gè)類名
方法
add() 添加指定的類值（class value）池凄。如果這些類已經(jīng)存在于元素的屬性中，那么它們將被忽略鬼廓。
刪除指定的類值肿仑。（注意： 即使刪除不存在的類值也不會(huì)導(dǎo)致拋出異常。）
item( Number )：按集合中的索引返回類值碎税。
toggle：當(dāng)只有一個(gè)參數(shù)時(shí)：切換類值尤慰；也就是說，即如果類值存在雷蹂，則刪除它并返回 false伟端，如果不存在，則添加它并返回 true匪煌。當(dāng)存在第二個(gè)參數(shù)時(shí)：若第二個(gè)參數(shù)的執(zhí)行結(jié)果為 true责蝠，則添加指定的類值，若執(zhí)行結(jié)果為 false萎庭，則刪除它霜医。
contains( String )：檢查元素的類 class 屬性中是否存在指定的類值。
replace( oldClass, newClass )：用一個(gè)新類值替換已有的類值驳规。
示例
<button id="btn">按鈕</button>
<div class="box">
<p id="con" class="con show">concon</p>
</div>
var oBtn = document.getElementById("btn");
var oCon = document.getElementById("con");
oBtn.onclick = function () {
// oCon.className = "red";
// console.log(oCon.className); //red
oCon.className = "con show red";
//這個(gè)red類已經(jīng)存在于元素的屬性中肴敛，那么它將被忽略
oCon.className += " red";
console.log(oCon.classList.length); //3
//在原有的類名基礎(chǔ)上添加一個(gè)類名
//oCon.classList.add("red");
// 在原有的類名基礎(chǔ)上 移出某一個(gè)類名
// oCon.classList.remove("con");
// 如果有這個(gè)類名 則刪除這個(gè)類名，如果沒有 則添加減去
//oCon.classList.toggle("blue");
// 判斷元素是否包含某一個(gè)類名
//console.log(oCon.classList.contains("con"));
// 根據(jù)索引 獲取類名
//console.log(oCon.classList.item(0)); //con
}
