HTML 5 APIでは、ページDOMの各ノードにclassListオブジェクトがあり、プログラマは中の方法でノード上のCSSクラスを追加、削除、修正することができます.classListを使用すると、プログラマはノードにCSSクラスが付与されているかどうかを判断することもできます.

Element.classList

このclassListオブジェクトには多くの有用な方法があります.

{  
 length: {number}, /* # of class on this element */
 add: function() { [native code] }, 
 contains: function() { [native code] },
 item: function() { [native code] }, /* by index */ 
 remove: function() { [native code] },
 toggle: function() { [native code] }
}

ご覧の通りclassListクラスは小さいですが、中のすべての方法が役に立ちます.

CSSクラスの追加

addメソッドを使用すると、ページ要素に1つ以上のcssクラスを追加できます.

myDiv.classList.add('myCssClass');

CSSクラスを削除

removeメソッドを使用すると、単一のCSSクラスを削除できます.

myDiv.classList.remove('myCssClass');

この方法では、複数のクラス名を一度に入力してスペースで分けることができますが、実行結果は予想外である可能性があります.

CSSクラスの有無を反転

myDiv.classList.toggle('myCssClass'); //     
myDiv.classList.toggle('myCssClass'); //     

この方法の役割はmyDiv要素にこのCSSクラスがない場合、このCSSクラスを追加することです.myDiv要素にすでにこのCSSクラスがある場合は、削除します.反転操作です.

CSSクラスが含まれているかどうかを確認します

myDiv.classList.contains('myCssClass'); //returns true or false

現在、すべての現代ブラウザ(火狐ブラウザ、Googleブラウザなど)がこのclassListクラスをサポートしているので、新しいjavaScriptクラスライブラリではclassListクラスを使用してページCSSクラスを操作し、以前のように要素ノードのclass属性を分析する必要はないと信じています.