DOM事件

目录

1. 事件监听

2. 事件类型

 3. 事件对象

3.1 获取事件对象

3.2 事件对象常用属性

---

1. 事件监听

什么是事件？

事件就是 浏览器 或 用户做出的事情，比如：用户在网页上 单击 一个按钮。

什么是事件监听？

就是让程序监测是否有事件产生，一旦有 事件触发 ，就立即调用一个函数 做出响应 ，也称为 绑定事件 或者 注册事件。 即， 监听用户的行为，做出反馈 ，比如：鼠标经过显示下拉菜单、点击按钮可以播放轮播图等等。

事件监听三要素：

• 事件源：哪个dom元素身上发生了事件
• 事件类型：发生了什么事件，比如：鼠标单击 click、鼠标经过 mouseover 等
• 事件调用的函数：要做出什么反馈

事件监听

语法：

举例：

2. 事件类型

 3. 事件对象

事件对象是什么

• 当一个事件发生后，跟 事件相关的信息并记录到了一个对象 中，这个对象就是“事件对象”
• 例如：鼠标点击事件中，事件对象就存了鼠标点在哪个位置等信息

使用场景

• 可以判断用户按下哪个键，比如：按下回车键可以发布评论
• 可以判断鼠标点击了哪个元素，从而做相应的操作

3.1 获取事件对象

语法：

• 在事件绑定的回调函数，其第一个参数就是事件对象
• 一般命名为event、ev、e、evt

3.2 事件对象常用属性

部分常用属性：

• type
  • 获取当前的事件类型
• clientX/clientY
  • 获取光标相对于浏览器可见窗口左上角的位置
• offsetX/offsetY
  • 获取光标相对于当前DOM元素左上角的位置
• key
  • 用户按下的键盘键的值
  • 现在不提倡使用keyCode