javascript 捕获与泡沫（事件）

Posted 2021-05-03

# Explanation

Events can be activated at two occasions: At the beginning ("capture"), and at the end ("bubble").
Events are executed in the order of how they're defined. Say, you define 4 event listeners.

## The alert boxes will pop up in this order

- 2 (defined first, using capture=true)
- 4 (defined second using capture=true)
- 1 (first defined event with capture=false)
- 3 (second defined event with capture=false)

window.addEventListener("click", function(){alert(1)}, false);
window.addEventListener("click", function(){alert(2)}, true);
window.addEventListener("click", function(){alert(3)}, false);
window.addEventListener("click", function(){alert(4)}, true);

// Order of execution

// 2
// 3
// 1
// 3