js事件的三個階段:捕獲,目標,冒泡
IE:IE事件流是事件冒泡流 Netscape事件流是事件捕獲流
IE事件流 叫做事件冒泡,即事件開始時由最具體的元素(文檔中嵌套最深的那個節點)接收,然后逐級向上(一直到文檔)。事件捕獲與事件冒泡事件流正好相反的順序,事件捕獲的事件流是最外層逐級向內傳播。
**dom結構
<div id="parent">
parent
<div id="child">
child
</div>
</div>
js捕獲,捕獲,冒泡實驗,
var child = document.getElementById("child");
var parent = document.getElementById('parent');
child.addEventListener('click',function(){
console.log("child 捕獲");
},true)
child.addEventListener('click',function(){
console.log("child 冒泡");
},false)
parent.addEventListener('click',function(){
console.log('parent 捕獲')
},true);
parent.addEventListener('click',function(){
console.log('parent 冒泡')
},false);
當點擊 child DOM 時
輸出:
parent 捕獲
child 捕獲
child 冒泡
parent 冒泡
點擊 parent DOM 時
輸出:
parent 捕獲
parent 冒泡
阻止默認事件兼容代碼書寫
input.onclick = function(s){
var e = s || window.event ;
e.returnValue = false;
e.preventDefault();
return false;
}