javascript事件冒泡
一事件
在瀏覽器用戶端應用平台,基本生都是以事件驅動的,即某個事件發生,然後做出相應的動作。
瀏覽器的事件表示的是某些事情發生的訊號。事件的闡述不是本文的重點,尚未瞭解的朋友,可以訪問W3school教程 進行瞭解,這將有助於更好地理解以下的內容 。
二冒泡機制
在javascript中,冒泡機制和在演算法資料結構中的概念是不一樣的。在這裡主要的反饋的是事件流過程中事件捕獲後的一個冒泡反饋的過程。
正如這張圖看到的,這個氣泡就相當於我們這裡的事件,而水則相當於我們的整個dom樹;事件從dom 樹的底層 層層往上傳遞,直至傳遞到dom的根節點。<喎?http://www.bkjia.com/kf/ware/vc/" target="_blank" class="keylink">vcD4KPHA+0rK+zcrHyOfPws28PC9wPgo8cD48aW1nIHNyYz0="http://www.2cto.com/uploadfile/Collfiles/20140814/20140814091511180.png" alt="\">
在這裡,我寫個簡單的案例進行分析下;
事件冒泡案例
跟著為其添加點擊事件
事件冒泡案例
一般地,事件在傳遞過程中會有一些資訊,這些是事件的組成部分:事件發生的時間+事件發生的地點+ 事件的類型+事件的當前處理者+其他資訊,
b.終止事件的冒泡
事件冒泡案例<script type="text/javascript"> window.onload=function(){ var odiv=document.getElementById('div3'); odiv.onclick=function(ev){ var Event=ev||event; Event.alert("要被阻止了"); Event.cancelBubble=true; } } </script>
這樣添加了cancelBubble之後,點擊div3圖層的冒泡事件就被阻止了