day26

day26

1.js事件

js是事件驱动语言，绝大部分代码都是事件发生后才执行

1.事件三要素：事件源、事件、事件驱动程序

2.事件绑定

（1）给事件源的事件属性赋值

给事件源的事件属性赋值 —— 函数中的this是window

（2）通过节点绑定：事件节点.事件属性 = 函数

函数中的this是事件源(当前事件发生的节点)

注意：如果事件源是箭头函数，this是window

（3）通过节点绑定：事件源节点.addEventListenner(事件名，函数)

函数中的this是事件源

注意：事件名是事件函数去掉on；这种绑定方式可以给同一个事件源的同一个事件绑定不同的驱动程序

---

2.常用事件

1.onload - 页面加载完成

2.点击事件：onclick

需要关注事件对象的clientX/clientY(到浏览器顶部和左边的距离)，offsetX/offsetY(到事件源顶部和左边的距离)

3.onmouseover(鼠标进入标签)/onmouseout(鼠标离开标签)

4.onkeydown(键盘按下)

5.onchange - 值改变事件

---

3.事件冒泡和事件捕获

事件冒泡：当一个标签产生某个事件后，这个事件会传递给它的父标签

捕获当前事件：evt.stopPropagation()