30代半ば女子が無謀にもプログラマーになるまでの道のり

ハンバーガーボタン🍔

スクール受講中になんとか分からないながら作れたものです。

See the Pen ハンバーガーボタン by riko (@ri-ko) on CodePen.

私のJSコード作成時の脳内では、

①js-btnを変数に格納して、addEventListener関数を使い第一引数にクリック(というイベント)、第二引数に無名関数、第三引数は省略可(省略すると自動でfalseとなる)を持たせる。

②addEventListener関数の引数＝”変数に格納したノード” がクリックされる度に、処理が実行されるコードを書く。

③toggleの引数(“active”)が、classListに含まれていれば削除し、含まれていなければ追加されるようにする。

→「初めてのクリック(on)でクラスにactiveを追加、次のクリック(off)でクラスのactiveを削除」これがセット。

★addEventListener関数は第一引数で関数を呼び出していることになるのか？ここが未だに分からないところ…

※バカでかく作ったので、サイズに注意です。