事件机制

Posted 2021-01-21 longhua-0

 

DOM 2.0 事件处理流程：捕获阶段，目标阶段，冒泡阶段。

因点击所以window发送事件流，走到目标之前阶段是捕获阶段，返回路线是冒泡阶段。

根据这个机制可以监听此事件并作出响应（实践中是执行回调函数）。

 

 

Event对象：

document.createEvent(type) //生成一个事件对象，只能被element.dispatchEvent()使用

Element.addEventListener()：添加事件的回调函数  
Element.removeEventListener()：移除事件监听函数  
Element.dispatchEvent()：触发事件

//ie8
Element.attachEvent(oneventName,listener)
Element.detachEvent(oneventName,listener)

// event对象  
var event = window.event||event;    

// 事件的目标节点  
var target = event.target || event.srcElement;

// 事件代理  
ul.addEventListener(‘click‘, function(event) {   
  if (event.target.tagName.toLowerCase() === ‘li‘) {   
    console.log(event.target.innerhtml)   
  }  
});