JavaScriptにおけるイベントバブリングの即時停止
イベント処理を完全に停止するために、
現代のブラウザは stopImmediatePropagation メソッドをサポートしています。
このメソッドはバブリングを防ぐだけでなく、
現在の要素でのイベント処理も停止します。
実際に使用してみましょう：
elem1.addEventListener('click', function() {
console.log('緑');
});
elem2.addEventListener('click', function(event) {
console.log('青 - 最初のハンドラ');
event.stopImmediatePropagation(); // バブリングを停止
});
elem2.addEventListener('click', function() {
console.log('青 - 2番目のハンドラ'); // もはや動作しない
});
elem3.addEventListener('click', function() {
console.log('赤');
});
確認することができます：
