ラボ > Javascript関連:イベント関連

js 1回だけ実行させたいイベント設定(addEventListener()のオプション)

1回だけ実行したいイベント…removeEventListener()するために実行内容を関数にするのは…面倒

作成日:2024-07-10, 更新日:2024-07-10

設定

●●●.addEventListener('load', function(){
	~ 好きな処理 ~
}, { once: true, capture: true });
  • once: true - イベントリスナーを一回だけ実行
  • capture: true - キャプチャフェーズでリスナー。上記の「イベント: load」の場合、設定不要

メモ

・キャプチャフェーズ (Capture Phase): 最上位の祖先要素からターゲット要素に向かって伝播
・バブリングフェーズ (Bubbling Phase): ターゲット要素から最上位の祖先要素に向かって伝播
通常は、バブリングフェーズ 。あえてキャプチャフェーズ にしたいときに設定