Słuchacze zdarzeń zarejestrowane dla fazy przechwytywania nie zostały wyzwolone przed propagacją - dlaczego?
Usiłuję zrozumieć, co decyduje o kolejności wywoływania procedur obsługi zdarzeń po kliknięciu zagnieżdżonego<div> - to, co widzę, wydaje się być w sprzeczności z udokumentowanym zachowaniem, więc szukam trochę pomocy, aby to zrozumieć.
Mam 2 zagnieżdżone divy, do których dołączone są dwie procedury obsługi zdarzeń, jedna dla fazy przechwytywania, a druga dla fazy propagacji:
<html>
<head>
<script>
function setup(){
var outer = document.getElementById('outer');
outer.addEventListener('click', function(){console.log('outer false');}, false);
outer.addEventListener('click', function(){console.log('outer true');}, true);
var inner = document.getElementById('inner');
inner.addEventListener('click', function(){console.log('inner false');}, false);
inner.addEventListener('click', function(){console.log('inner true');}, true);
}
</script>
<style>
div {
border: 1px solid;
padding: 1em;
}
</style>
</head>
<body onload="setup()">
<div id="outer">
<div id="inner">
CLICK
</div>
</div>
</body>
</html>
Wedługco przeczytałem wyjście powinno być:
outer true
inner true
inner false
outer false
ale to co widzę (w Chrome i Firefox) to:
outer true
inner false
inner true
outer false
Czy ktoś może wyjaśnić tę rozbieżność?