1. js中事件流機制, 分為三個階段, 事件捕獲階段、處於目標階段、事件冒泡階段
2. 事件捕獲階段, 瀏覽器會從根節點開始由外到內進行事件傳播
事件傳播的順序是: window -> document -> div -> div -> 結點
通過函式新增 element.addeventlistener(event, function, usecapture)
true - 事件控制代碼在捕獲階段執行,false- false- 預設。事件控制代碼在冒泡階段執行
3.事件冒泡機制
事件傳播的順序: 結點 -> div -> ... -> document -> window
通過函式新增 element.addeventlistener(event, function, usecapture)
true - 事件控制代碼在捕獲階段執行,false- false- 預設。事件控制代碼在冒泡階段執行
1. 什麼是js事件機制
事件機制是js中事件處理的過程, 不同的瀏覽器可能會有細微差別, 理解事件流機制對開發很有幫助
2. 什麼是事件捕獲, 什麼是冒泡?
事件捕獲先從window和document和html, body出發, 到目標結點結束
事件捕獲先從目標結點出發,到body,html,document和window結束
3.如何新增事件冒泡和事件捕獲?
可以使用addeventlistener這個函式, 最後乙個引數, 如果是false, 就是冒泡, 預設是false, 可以不寫
element.addeventlistener(event, function, false)
4.如何停止事件派發(停止事件流)
如果有這樣的事件傳播機制, window -> document -> .....-> 目標div -> ... -> document -> window
那麼在任意事件處理函式中執行 e.stoppropagation()即可停止傳播
注意: propagation這個單詞的意思是 n. 傳播; 擴充套件; 宣傳; 培養
5.什麼是事件委託? 如何實現事件委託?
因為時間冒泡, 子元素的事件會冒泡到父元素
所以可以給父元素新增事件, 委託子元素的處理
6.如何處理預設事件
a或者submit的跳轉, 直接實現onclick函式, 然後在其中執行以下**即可
e.preventdefault();
注意: prevent這個單詞的意思是 v. 阻止; 阻礙; 阻撓
7.ie和w3c標準繫結事件的區別?
dom：addeventlistener、
removeeventlistener、
dispatchevent
ie-dom：attachevent、
detachevent、
fireevent
//注意: 請檢視, 很多地方都有區別
//注意: ie11開始使用標準事件
8.如何手動觸發事件
// 建立
var evt = document.createevent("htmlevents");
// 初始化
evt.initevent("alert", false, false);
// 觸發, 即彈出文字
dom.dispatchevent(evt);
9. dom0和dom2的事件有哪些區別?
dom0主要的函式有onclick等
dom2級的事件規定了事件流包含三個階段包括：
1：事件捕獲，
2：處於目標階段，
3：事件冒泡階段
（ie8以及更早版本不支援dom事件流）;
dom2是通過addeventlistener繫結的事件,
還有ie下的dom2事件通過attachevent繫結;
JavaScript基礎8事件函式 事件流
1.新增事件的方式 獲取節點後新增onclick屬性 var i document.getelementbyid box i.onclick function i.onclick function 重複的會覆蓋 獲取節點後新增事件監聽屬性 var i document.getelementbyid ...
JavaScript中事件冒泡與事件捕獲
如圖 現在有3個巢狀div，且都有onclick事件，當div 3被單擊時，依次觸發div 3 div 2 div 1的click事件。這就是事件冒泡 當乙個事件被觸發時，依次由最上層元素 div 3 向下遍歷並執行該元素及父元素相同事件的過程就是事件冒泡。當事件由最底層 div 1 向上遍歷並執行...
Javascript中的事件繫結
等價於 window.nl ad bodyonload 如果希望乙個事件繫結多個方法，這樣是不行的 window.nl ad bodyonload1 window.nl ad bodyonload2 window.nl ad bodyonload3 他只會執行最後乙個，這裡有個dom方法 attac...