這篇文章主要介紹了javascript 中事件冒泡和事件捕獲機制的詳解的相關資料,網上的相關資料有很多，但是講的不是多清楚，透過本文希望能讓大家理解掌握，需要的朋友可參考下方
javascript 中事件冒泡與事件擷取機制的詳解
二者作用：描述事件觸發時序問題
事件捕捉：從document到觸發事件的那個節點，即自上而下的去觸發事件---由外到內
事件冒泡：自下而上的去觸發事件---由內到外
綁定事件方法的第三個參數，就是控制事件觸發順序是否為事件捕獲
#true,事件捕獲；false,事件冒泡
一般預設false,即事件冒泡
Jquery的e.stopPropagation會阻止冒泡，意思就是到DOM為止，祖先級的事件就不要觸發了
下面是我嘗試的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件冒泡与事件捕获</title>
<script>
window.onload = function () {
document.getElementById("parent").addEventListener("click",function(e){
alert("parent事件被触发，"+this.id);
},true)
document.getElementById("child").addEventListener("click",function(e){
alert("child事件被触发，"+this.id)
},true)
}
</script>
</head>
<body>
<p id="parent">
parent事件
<p id="child" class="child">
child事件
</p>
</p>
</body>
</html>例子裡我加了第三個true，就是事件捕獲。
如果不加則是預設的事件冒泡，這時候事件觸發時序就是自內向外
以上是有關javascript中事件冒泡和事件捕獲機制的詳細內容。更多資訊請關注PHP中文網其他相關文章！
