javascript對象--8 事件

事件對象 ：在執行響應對象函數前由瀏覽器建立的對象。該對象封裝了本次事件的基本信息以及處理事件流的方法。（在DOM標準中規定的事件對象的功能較少，所以哥哥瀏覽器都作了擴充，所以不少事件屬性和方法不兼容）

事件對象 ：｛

基礎事件對象的屬性方法

｝

1、經常使用基本屬性 ：（下面四個對象均爲只讀屬性）

target : 獲取事件對應的最詳細元素的Dom對象

currentTarget : 獲取綁定了響應函數的Dom對象

currentTarget :不必定與target相等

type : 獲取事件類型， 例如   click

timeStamp : 獲取時間戳。 Numbe類型 ---當前觸發事件的時間點

一、target : 獲取事件對應的最詳細元素的Dom對象

<script>
			window.addEventListener("load", function(){
				register ();
			})
			
			function register (){
				document.getElementById("outerDiv").addEventListener("click" ,handleEvent )
			}
			
			function handleEvent(e){
				//e就是瀏覽器封裝好的 event 對象
				// 獲取當前事件對象的第二種方式：window.event（window.event === e）;
				//e.target不必定是綁定事件的dom元素，是當前操做的最詳細的DIV，距離點擊最近的元素
				console.log(e.target);
				
			}
</script>

<h2>只讀基本屬性</h2>
		<div id="outerDiv" style="height: 200px; width: 200px; background-color: coral;">
			<div id="innerDiv" style="height: 100px; width:100px; background-color:cornflowerblue;">
			
		    </div>
</div>

二、獲取當前綁定事件對象

//獲取綁定了事件的事件源 target不必定與currentTarget相等
console.log(e.currentTarget);

console.log(e.currentTarget);
console.log(e.type);
console.log(e.timeStamp);

2、阻止冒泡及捕獲的屬性以及方法

bubbles :獲取綁定的事件的方式是否設定了冒泡或捕獲（ 只有使用 DOM2級綁定方式是返回true）.Boolean類型。

stopPropagation( ) ;在bubbles爲true時，阻止繼續冒泡或捕獲。

stopImmediate Propagation():強制阻止冒泡或捕獲。

阻止默認行爲的屬性和方法

window.addEventListener("load", function(){
				register ();
			})
			
			function register (){
				
		        document.getElementById("outerDiv").addEventListener("click" ,function(){
					alert("outerDIV1執行");
				},false); //冒泡階段
				
				document.getElementById("innerDiv").addEventListener("click" ,function(){
					alert("innerDIV1執行");
				},false);//冒泡階段
			}

點擊innerDIV時

在冒泡階段先執行 

一、彈出   innerDIV=1執行    二、彈出 outerDIV執行

document.getElementById("innerDiv").addEventListener("click" ,function(){
					alert("innerDIV1執行");
					event.stopImmediatePropagation();//阻止繼續冒泡
					
				},false);//冒泡階段
			}

默認行爲：

某些元素在用戶操做時，在不調用任何程序的狀況下也會發生具體行爲。例如 input type = submit 點擊時會提交整個form表單。

defaultPrevented :獲取是否組織了默認行爲，boolean類型。

preventDefault( ) :阻止默認行爲。