js---事件

事件

可以为按钮的对应事件绑定处理函数的形式来响应事件

btn.onclick=function(){
    alert("haha")
}

onscroll

该事件会在元素的滚动条滚动时触发 

 

onmousemove

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

 

事件对象

当事件的响应函数被触发时，浏览器每次都会讲一个事件对象作为实参传递进响应函数

在事件对象中封装了当前事件相关的一切信息

btn.onclick=function(e){
console.log(e)
}

 

clientX和clientY

用户获取鼠标在当前可见窗口的坐标

pageX和pageY

可以获取鼠标相对于当前页面的坐标

 

事件的冒泡（Bubble）

即事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发

 将事件的cancelBubble=true来取消冒泡

 

事件的委派

将事件统一绑定给元素共同的祖先元素，这样当后代元素上的事件触发时会一直冒泡到祖先元素

从而通过祖先元素的响应函数来处理事件

 

target

event中的target表示触发事件的对象

 

事件的绑定

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

它只能同时为一个元素的一个事件绑定一个响应函数

不能绑定多个，如果绑定了多个，则后边的会覆盖掉前边的

 

addEventListener()

该方法可以为元素绑定响应函数

参数：

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

　　2.回调函数

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

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

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

btn.addEventListener("click",function(){alert("haha")},false)