DOM事件类
- 基本概念: DOM事件的类别
- DOM事件模型(捕获和冒泡)
- DOM事件流
- 描述DOM事件捕获的具体流程
- Event对象的常见应用
- 自定义事件
dom事件类
- DOM0 element.onclick=function(){}
- DOM2 element.addEventListener(‘click’, function(){}, false)
- DOM3 element.addEventListener(‘keyup’, function(){}, false)
事件模型
- 捕获
- 冒泡
事件流
- 捕获
- 目标阶段
- 冒泡
描述DOM事件捕获的具体流程
- window
- document
- html(如何获取:document.documentElement)
- body
- … // 父级 -> 子级
Event对象
- event.preventDefault(); //阻止默认事件
- event.stopPropgation(); //阻止冒泡
- event.stopImmediatePropagation();
- 按钮上注册了两个click事件,阻止另一个click事件执行
- event.currentTarget() // 当前所绑定的事件
- event.target //当前被点击的元素
自定义事件(模拟事件)
var e = new Event('testEvent');
//CustomEvent可以指定自定义参数
ev.addEventListener('testEvent', function(){
console.log('testEvent');
})
ev.dispatchEvent(eve)