当用户与网页发生交互时，可以使用事件监听器来绑定事件，在事件发生时执行相应的代码。

事件分为：

1.浏览器事件：window.onload,window.scroll等。

2.http请求事件：ajax、websocket等。

3.用户操作事件：鼠标按下或松开、回车、页面滚动等。

4.计时器事件：setInterval,setTimeout。

二、JavaScript事件处理机制是什么?

事件处理一共有三个阶段，包括捕获、目标阶段、冒泡三个阶段，传播顺序为：

捕获：从document逐级向下传播到目标元素。由于IE低版本浏览器不支持，所以很少使用事件捕获；

目标阶段：事件到达目标节点时，就到了目标阶段，事件在目标节点上被触发

冒泡：从下至上，从目标触发的元素逐级向上传播，直到window对象；

如图：

三、事件监听

对事件的监听常见的三种方法：

1.直接对DOM元素事件进行绑定：

"btn" onclick="go()" >

2.在JavaScript中对DOM元素进行事件绑定:

document.getElementById('btn').onclick=function(){};

3.利用监听函数addEventListener("事件名",callback,false):

第三个参数：true捕获阶段调用事件处理方法；false冒泡阶段调用事件处理方法。

document.getElementById('btn').addEventListener("click",function(){console.log('事件触发');});//解除事件,如果要移除事件句柄，addEventListener() 的执行函数必须使用外部函数。document.getElementById('btn').removeEventListener("click",callback);

注意:IE8不支持addEventListener和removeEventListener方法

实现了两个类似的方法：

attachEvent("事件名",callback)；//事件处理程序名称

detachEvent("事件名",callback);//事件处理程序方法

四、阻止默认事件。

如果是直接对DOM进行绑定的事件，或者在JavaScript中对DOM进行绑定的事件，则直接return false；即可。

document.getElementById('btn').onclick=function(){  console.log('触发事件');  return false;};

如果是使用监听函数，则需要用到event.preventDefault()；

function callback(e){  console.log('事件触发');  //阻止默认事件  if(e.preventDefault){    e.preventDefault();  }else{    e.returnValue = false;//IE8-  }  //默认冒泡事件  if(e.stopPropagation){    e.stopPropagation();  }else{    e.cancelBubble = true;//IE8-  }}document.getElementById('btn').addEventListener("click",callback);