JavaScript 事件总结

1.Javascript事件的一个知识点总结，事件它指的是文档或则浏览器窗口中发生的一些特定的交互瞬间，那么JavaScript与HTML它们之间的交互式是通过一个事件去实现的。对于Web应用来讲，有这些代表性的事件：单机事件，鼠标移入移出事件，键盘按下时/弹起事件等等。
(1)这里写了一个CSS样式，button按钮和一个button的点击事件，在浏览器里点击按钮就会触发一个事件，弹出一个提示框。然后console.log(btn)，输出的结果是是按钮这里就是已经获取到它了。检测输出结果为object对象.

2.onload页面加载事件：
浏览器在加载一个页面时，是按照自上而下的顺序加载的读取到一行的时候就会运行一行，如果script标签写在上面，在执行代码时，页面没有加载。
(1)onload事件会在整个页面加载完成之后会触发，为window绑定一个onload事件。示列：
在浏览器运行点击按钮，并弹出一个提示框。

(2)输出结果：

3.Event事件对象：
(1)当事件的函数被触发时，浏览器每次都会将一个事件对象，作为一个实参来传递，传递进响应函数，在事件对象中去封装当前事件相关的一切信息，比如：鼠标的坐标，键盘按键被按下时，鼠标滚轮滚动的某个方向。
在IE8及以下的浏览器中，是将事件对象作为window对象的属性保存。
用IE8浏览器运行，响应函数被触发时，他不会去传递事件对象。
(2 )clientX 获取鼠标指针的水平坐标
clientY 获取鼠标指针的垂直坐标
clientX和clientY 用于获取鼠标当前可见窗口的坐标，div的偏移量是相对于整个网页的。
写法：Var left=event.clientX; var top=event.clientY;
(3)pageX和pageY是用于获取鼠标相对于当前页面的坐标，这个属性在IE8中并不兼容，如果需要兼容IE8不要去使用。
写法：var left=event.pageX； var top=event.pageY;

2.事件冒泡：
所谓冒泡指的就是事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发，在开发过程中大部分情况冒泡都是有用的，如果不希望冒泡发生可以去通过事件对象去取消冒泡，写法：event.cancelBubble=true;

4.事件的委派
将事件统一绑定给元素共同的祖先元素，当后代元素上的事件触发时，会一直冒泡到祖先元素，从而通过祖先元素的响应函数来处理事件，时间的委派是利用冒泡，通过委派可以减少事件绑定的次数，提高程序的性能，事件对象属性为target:返回触发此事件的元素（事件的目标节点）

5.事件的绑定：
(1)通过addEventListener方法可以为元素绑定响应函数，它可以同时为一个元素的相同事件绑定多个响应函数，这样当事件被触发时，响应函数将会按照函数的绑定顺序执行，这个方法不支持IE8及以下浏览器。
(2)参数：
时间的字符串，不加on
回调函数，事件被触发时该函数会被调用
是否在捕获阶段触发事件，需要一个布尔值，一般都传false，示列：
提示框里返回的第一个是1.第二个是2

(3)对象attachEvent有on的事件名字，事件处理函数；它可以绑定多个事件，谷歌和火狐不支持，IE8支持。

6.事件的传播：
(1). 捕获阶段：事件从根节点流向目标节点，途中流经各个DOM节点，在各个节点上触发捕获事件，直到达到目标节点。
(2). 目标（target）阶段：在此阶段中，事件传导到目标节点。浏览器在查找到已经指定给目标事件的监听器后，就会运行该监听器。
(3). 事件冒泡: 当为多个嵌套的元素设置了相同的事件处理程序，它们将触发事件冒泡机制。在事件冒泡中，最内部的元素将首先触发其事件，然后是栈内的下一个元素触发该事件，以此类推，直到到达最外面的元素。如果把事件处理程序指定给所有的元素，那么这些事件将依次触发。

7.事件案例的拖拽：
(1)鼠标被拖拽元素按下时，开始拖拽onmousedown
box.οnmοusedοwn=function(){};
(2)鼠标移动式被拖拽的元素跟着鼠标移动onmousemove
document.οnmοusemοve=function(event){}
(3)鼠标松开时，被拖拽固定在当前位置onmouseup
document.οnmοuseup=function(){};

8.事件捕获：
(1)当我们调用一个元素的setCapture()方法以后，这个元素将会把下一次所有的鼠标按下相关的事件捕获到自身上。
(2)setCapture()方法，只有IE支持，但是火狐中调用不会报错，如果使用chrome调用，它就会报错。

9.键盘事件：
(1)Onkeydown：当键盘按下的一个事件，一直按着某个键不放开，就会一直触发事件。
(2)Onkeydown()事件连续被触发时，第一次和第二次之间的间隔时间稍微长一点，其它的则会非常快，这是防止误操作的发生。
(3)键盘事件一般都会绑定一些可以获取焦点的对象或则是document.
(4)可以通过keyCode来获取按键的编码，通过它可以判断那个键被按下。
(5)除了keyCode.事件对象中还提供了几个属性： altKey， ctrlKey， shiftKey
-这三个属性分别是用来判断alt cltrl shift是否被按下的如果被按下了则返回true,否则返回false。