JS 事件

1、DOM事件流

事件流包括三个阶段：事件捕获阶段、处于目标阶段 和 事件冒泡阶段。

注意：IE9、Opera、Firefox、Chrome 和 Safari 都支持 DOM 事件流；IE8 及更早版本不支持 DOM 事件流。

22722694.png

2.事件处理程序

1.HTML事件处理程序

2.DOM0 级别事件处理程序
dom0级事件处理程序的缺点：一个事件只能有一个事件处理程序！
3.DOM2 级事件处理程序
dom2:
事件都把on统统的去掉

3.事件类型

31269653.png

4.DOM2

1.addEventListener

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/4951956-59d3fdcacce9c8ba.png?
imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

2.removeEventListener

Paste_Image.png

5.事件对象

Paste_Image.png

6.offsetX和offsetY

相对于触发原点边界的X、Y坐标

7.screenX和screenY

触发原点相对于屏幕边缘的x、y坐标

8.clientX和clientY

当前光标相对于浏览器浏览器窗口客户区域左上角的坐标(客户区域不包括状态栏、菜单栏等。)

9.pageX和pageY

相对于文档区域的位置

Paste_Image.png

Paste_Image.png