I am confused with event.eventPhase
. See the code below.
const e1=document.getElementById("id1");
function onclicked(e)
{
console.log(e.eventPhase);
console.log(e);
alert(e.target.id ' clicked');
}
e1.addEventListener('click',onclicked,false);
e1.addEventListener('click',onclicked,true);
<div id="id1">hello world</div>
When clicking on "hello world", the onclicked
function is called twice. But console.log(e.eventPhase);
always outputs 2(AT_TARGET). More weirdly, console.log(e);
always shows e.eventPhase=0
(by clicking to expand the structure e shown in Firefox devtools console). I think e.eventPhase should be 1(CAPTURING_PHASE) in the first call of onclicked and 3(BUBBLING_PHASE) in the second call, according to this