var btn = document.getElementById("btn"); document.body.addEventListener("click", function() { console.log("bodyListener" + event.eventPhase); }, true) //捕获阶段 btn.onclick = function() { console.log("btn" + event.eventPhase); } //目标对象阶段，实际上属于冒泡阶段（在btn上） document.body.onclick = function() { console.log("body" + event.eventPhase); } //冒泡阶段（在body上）
又如：
var btn = document.getElementById("btn"); document.body.addEventListener("click", function() { console.log(event.eventPhase); //1 console.log(event.currentTarget); //HTMLBodyElement }, true); btn.addEventListener("click", function() { console.log(event.eventPhase); //2 console.log(event.currentTarget); //HTMLInputElement }); document.body.addEventListener("click", function() { console.log(event.eventPhase); //3 console.log(event.currentTarget); //HTMLBodyElement });
流程大概是：
document.body 捕获阶段 --> btn 目标对象阶段 --> document.body 冒泡阶段
以上就是关于JavaScript事件对象，希望对大家的学习有所帮助。
您可能感兴趣的文章: