js事件总结

altKey 返回当事件被触发时，"ALT" 是否被按下。

button 返回当事件被触发时，哪个鼠标按钮被点击。

clientX 返回当事件被触发时，鼠标指针的水平坐标。

clientY 返回当事件被触发时，鼠标指针的垂直坐标。

ctrlKey 返回当事件被触发时，"CTRL" 键是否被按下。

metaKey 返回当事件被触发时，"meta" 键是否被按下。

relatedTarget 返回与事件的目标节点相关的节点。

screenX 返回当某个事件被触发时，鼠标指针的水平坐标。

screenY 返回当某个事件被触发时，鼠标指针的垂直坐标。

shiftKey 返回当事件被触发时，"SHIFT" 键是否被按下。

onmousemove

- 该事件将会在鼠标在元素中移动时被触发

事件对象

- 当事件的响应函数被触发时，浏览器每次都会将一个事件对象作为实参传递传递进响应函数,在事件对象中封装了当前事件相关的一切信息，比如：鼠标的坐标 键盘那个按键被按下，鼠标滚轮滚动的方向

在IE8中，响应函数被触发时，浏览器不会传递事件对象，在IE8及以下的浏览器中，是将事件对象作为window对象的属性保存的

clientX  可以获取鼠标指针的水平坐标

clientY  可以获取鼠标指针的垂直坐标

avaScript事件冒泡（Bubble）

- 所谓冒泡指的就是事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发

- 在开发中大部分情况冒泡都是有用的，如果不希望冒泡发生可以通过事件对象取消冒泡 event.cancelBubble=true

事件的委派

- 指将事件统一绑定给元素共同的祖先元素，这样当后代元素上的事件触发时，会一直冒泡到祖先元素，从而通过祖先元素的响应函数来处理事件

- 事件委派是利用冒泡，通过委派可以减少事件绑定的次数，提高程序的性能

//事件对象的属性target：返回触发此事件的元素(事件的目标节点)

事件的绑定（拓展）

使用 对象.事件=函数形式绑定事件

它只能同时为同一个元素绑定同一事件一次

不能绑定多次，如果绑定多次，后面的会覆盖掉前面的

addEventListener()

- 通过这个方法也可以为元素绑定响应函数

- 参数：

1.事件的字符串，不加on

2.回调函数，当事件触发时该函数会被调用

3.是否在捕获阶段触发事件，需要一个布尔值，一般都传false

使用addEventListener()可以同时为一个元素的相同事件绑定多个响应函数

这样当事件被触发时，响应函数将会按照函数的绑定顺序执行

这个方法不支持IE8及以下的浏览器

attachEvent()

- 在IE8中可以使用attachEvent()来绑定事件

- 参数：

1.事件的字符串，要on

2.回调函数

- 这个方法也可以同时为一个事件绑定多个处理函数

不同的是它是后绑定先执行，执行顺序和addEventListener()相反

addEventListener()中的this，是绑定事件的对象

attachEvent()中的this，是window

需要统一两个方法的this

btn.addEventListener("click",function(){

console.log(this);

},false);

btn.attachEvent("onclick",function(){

console.log(this);

alert(this);

});

参数：

obj 要绑定事件的对象

eventStr 事件的字符串(不要on)

callback 回调函数

事件的传播(拓展)

事件的传播

  - 关于事件的传播网景公司和微软公司有不同的理解

  - 微软公司认为事件应该是由内向外传播，也就是当事件触发时，应该先触发当前元素上的事件，然后再向当前元素的祖先元素上传播，也就说事件应该在冒泡阶段执行。

- 网景公司认为事件应该是由外向内传播的，也就是当前事件触发时，应该先触发当前元素的最外层的祖先元素的事件，然后在向内传播给后代元素

- W3C综合了两个公司的方案，将事件传播分成了三个阶段

1.捕获阶段

  - 在捕获阶段时从最外层的祖先元素，向目标元素进行事件的捕获，但是默认此时不会触发事件

2.目标阶段

- 事件捕获到目标元素，捕获结束开始在目标元素上触发事件

3.冒泡阶段

- 事件从目标元素向他的祖先元素传递，依次触发祖先元素上的事件

- 如果希望在捕获阶段就触发事件，可以将addEventListener()的第三个参数设置为true一般情况下我们不会希望在捕获阶段触发事件，所以这个参数一般都是false

  - IE8及以下的浏览器中没有捕获阶段

W3C:万维网联盟，是Web技术领域最具权威和影响力的国际中立性技术标准机构

键盘事件：

onkeydown: 键盘被按下事件

- 如果一直按着某个键不松开，则会一直触发该事件

- 当onkeydown事件连续触发时，第一次和第二次之间的间隔时间稍微长一点，其他则会非常快。这是为了防止误操作的发生

onkeyup: 键盘被松开的事件

键盘事件一般都会绑定给一些可以获取焦点的对象或则是document