javascript htmlタグにクラスを追加する

javascript htmlタグにクラスを追加する

javascriptで、classList.addを使用して、htmlタグにクラスを追加するサンプルコードを記述してます。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 84.0.4147.105

classList.add使い方

classList.addを使用すれば、指定したhtmlタグにクラスを追加することが可能です。

実行結果

toggleを使用して追加することもできます。
toggleはクラスがなければ追加、あれば削除します。

サンプルコード

以下は、
「追加」ボタンをクリックすると、指定した要素クラスを追加して、事前に記述してあるcssを適応させる
サンプルコードとなります。

※cssには「bootstrap material」を使用してます。

クラスが追加されていることが確認できます。