JavaScript基础教程

第五讲

JS事件

• 事件流
• 事件处理
• event
• 鼠标事件
• 键盘事件
• 触摸事件
• 事件委托

事件流

1. 事件捕获
2. 事件冒泡
3. DOM2级事件

事件处理

• on(html)
• on(js)
• addEventListener(可以多次添加)
• removeEventListener

event

• target
• preventDefault
• currentTarget
• stopPropagation
• type

鼠标事件

• click
• dbclick
• mousedown 按下鼠标
• mouseup 释放鼠标
• mousemove 在元素内部移动 
• mouseleave 移动到元素外部 子元素不触发
• mouseout 移动到元素外部 子元素触发
• mouseover 移入元素 子元素触发
• mouseenter 移入元素 子元素不触发

鼠标的event

• pageX、pageY
• clientX、clientY
• screenX、screenY

键盘事件

1. keydown
2. keypress
3. keyup
4. keyCode
5. charCode

事件委托

因为我们大多数事件是冒泡的，所以我们可以通过给目标节点的父节点添加事件，然后判断event.target是不是子节点，如果是就执行函数，这就是事件委托