JavaScriptでスタイルの動的変更方法 - Qiitaはじめに JavaScriptは動的サイトを作成することが可能である。今回はスタイルの変更方法を3つ紹介します。 class名を変更 DOM要素を取得してclassNameプロパティの値を変更する方法です。 下のソースコードにおけるid名fooのdiv要素がこちらの方法にあたります。 mouseoverイベントとmouseoutイベントを登録しておき、イベント発生時にstyle.cssで予め用意してあった.foo-beforeと.foo-afterを交換しています。 また別の方法としてclassListを使用する方法がありあます。 toggleメソッドはtoggle(clazz)のように記述し、class名にclazzが含まれていれば削除、含まれていなければ追加するものです。 他にもaddメソッドやremoveメソッド、containsメソッドが存在します。
