复习:
1.事件三要素
事件源.事件类型=function(){}
记住
2.事件绑定三种方式:推荐事件监听方式
ele.addEventListener('click',fn)
记住
3.解除绑定:普通类型解绑;事件监听解绑
普通:ele.onclick = null / false
记住
监听解绑: ele.removeEventListener('click',函数名)
需要一个个移除
4.事件冒泡和事件捕获
补充:事件流(事件执行的顺序)IE认为由里及外,叫做事件冒泡 子元素是父元素的一部分
例子:inner–outer–body–document–window
网景公司认为是:由外及里把这种事件类型称为事件捕获,**在事件冒泡后面加true,**就可以捕获这种事件流的过程
例子:window–document–body–outer–inner
5.事件执行的 三个阶段
事件捕获—事件目标–事件冒泡
6.阻止事件冒泡
事件冒泡:子元素的触发会影响父元素的触发
注意:为了让事件冒泡的【子元素跟父元素不相互影响】,所以我们需要进行事件解绑
LS;希望子元素的事件不要影响父元素的事件
e.stopPropagation();
记住
e.cancleBubble=true;
记住
7.事件对象::描述整个事件发生的详细信息
mouseEvent
keyBoardEvent
formEvent
event是事件对象,可以写在形参里面。兼容写法
e=e||window.event;
兼容写法
事件对象跟事件目标的关系
事件目标target是事件对象里面的一个属性
var target
事件对象里面事件目标的兼容写法
8.事件委托:运用事件冒泡的思想
好处:
1、【节省资源同时减少了dom操作】提高性能
2、对于新添加的元素也会有之前的事件
一、委托:把事情给别人做
二、那么如何找到目标元素呢?因为事件目标是在事件对象里面。
所以我们写事件委托的时候,需要在函数的形参里面写event(事件对象),
所以找target时候是event.target
错误认知:事件监听跟事件委托有关系?。实际上事件监听只是一种绑定事件的方式,我们也可以用onclick方式写事件绑定。