連載シリーズどうもこんばんは!HYPのこうじです。イベントリスナー、色々ありますよね。関数に引数を付けないブラウザによってはつけてもちゃんと動作しますが、しない場合もあります。するかしないか分からないものは、指定しない方が無難です。後でイベントを削除したいとか、また追加したいとかある場合は関数を用意してセットするのが良いです。言った事の無い、今回だけよ。みたいなものは無名関数がラクです。あとで消したり足したりできないパターン。オカメインコが飼いたくなる処理。あとで消したり足したり汎用性がある。他でも使いまわし可能。オカメインコがパニックにならない処理。}よく使う作動条件ページが読み込まれたらごにょごにょしたい!めちゃくちゃ多いパターンだと思います。大した重くないスクリプトなら</body>直前に書いた方がラクかもしれません。DOM構築後に処理開始したい場合は、documentに対して『DOMContentLoaded』を指定します。ここでごにょごにょする。ここでごにょごにょする。});こちらの記事でも紹介しています。ページが読み込まれた後にコードを動かすイベントページが完全に読み込まれたらごにょごにょしたい!上記のパターンでは、DOMが読み込まれたら(htmlタグが読み込まれたら)動作を開始します。画像の高さや他のスクリプト等、ページが完全に読み込まれた後に開始したい場合はこちらを使用します。windowに対して『load』を指定します。注意する事は、“DOMContentLoaded”の方は”document”にセットするのに対し、こちらは“window”にセットします。最初これの違いにハマッた事あります。ここでごにょごにょする。ここでごにょごにょする。});こちらの記事でも紹介しています。ページが読み込まれた後にコードを動かすイベントクリックされた時にごにょごにょしたい!ありますね。マウス考えた人は神だと思います。アクションさせたい要素に対して『click』を指定します。ここでごにょごにょする。ここでごにょごにょする。});ページがスクロールされた時にごにょごにょしたい!あるある!あるでしょ!windowに対して『scroll』を指定します。ここでごにょごにょする。ここでごにょごにょする。});ページがリサイズされた時にごにょごにょしたい!ある!いやーもうありすぎて困る!たはー!○○px以下になったら、要素を移動するとか見えなくするとか、レスポンシブな動きもこれで対応出来ますね。windowに対して『resize』を指定します。ここでごにょごにょする。ここでごにょごにょする。});おわり大体よく使うハンドラ一覧でした!他にも制作時によく使うのが増えてきたらご紹介します。こうじWEBクリエイター+Windowsアプリいつもする作業をもっとミス無く楽ちんに出来るような環境が提供できれば幸いです。