2014年6月18日水曜日

DOMのclassListを使ってみる

classListとは

classListはHTML5で追加された比較的新しいプロパティです。
リスト化されたことによりclassNameプロパティで直接操作するより簡便にクラスを変更できるようになりました。

JavaScriptでスタイルをアクティブに変更するのに便利です。

classListのメソッド

メソッド名 機能
add(class)クラスリストへクラスを追加
remove(class)クラスリストからクラスを削除
contains(class)
toggle(class)クラスリストにclassが含まれていれば削除、なければ追加
item(number)クラスリストの番号を入れることで名前を取得
lengthクラスリストの要素数

toggleを使った例




 
 
 
 classList




classList