classListとclassNameを使用してclass属性を操作するには<JavaScript勉強中>
HTML5から利用できるようになったclassList、classNameを利用することで
HTMLのclass属性を操作できます!
便利なので使い方を覚えて取り入れましょう!
◆classList
element.classListで要素に紐付いたclass属性を取得できます。
主に以下のようなメソッドがあります。
- add: 要素のクラスリストへのクラスの追加
- remove: 要素のクラスリストからのクラスの削除
- toggle: 要素のクラスリスト中の特定のクラスの切替
- contains: 要素のクラスリストが特定のクラスを含むか否かの確認
では実際にそれぞれ使ってみます。(以下編集中)