Тонкости работы событий в Javascript

document.getElementById('a').addEventListener('click', function(e){ alert('1'); }, true); document.getElementById('b').addEventListener('click', function(){ alert('2'); }, false); document.getElementById('b').addEventListener('click', function(){ alert('4'); }, true);

Click me

Почему события срабатывают в последовательности 1,2,4 а не 1,4.2? Ведь, согласно документации, события обрабатываются сначала все с параметром true, а затем false.

Ответ

Согласно все той же документации, обработчики этапа capture вызываются в порядке от родительских элементов к дочерним, а обработчики этапа bubble - от дочерних к родительским (см. раздел 3.1)
Там же написано, что при достижении элемента, в котором событие возникло непосредственно - этап capture заканчивается и начинается этап target
Таким образом, непосредственные обработчики вызываются вне зависимости от параметра useCapture