前端
事件Event
你可能会问
事件到底是什么？代码是怎么知道我点了那个按钮的？
简单来说
用户操作或浏览器变化发出的信号，代码监听它来做出反应。
监听登记表
click更新计数
input校验格式
点我有人听，点击才有下文
01 · 先这样理解
把抽象概念放进真实场景
用户操作或浏览器变化发出的信号，代码监听它来做出反应。
换个角度想事件像门铃：客人按铃是触发，铃声响遍屋子是广播，只有守在门口的人（监听器）会去开门。没装铃，敲破手门里也没人知道。
02 · 点击演示
点一下按钮，谁在听？
突出显示的部分，就是当前概念在整条流程中负责的位置。
click
「按钮被点了一下」
addEventListener('click')
先登记，才有人接——试试两种都选一遍监听器处理函数：count + 1
只有登记过的，才会被叫起来
count
1 / 4
Trigger · 用户点击、输入或滚动
03 · 放进真实任务
什么时候会遇到它
响应操作
点击、输入、悬停、滚动，界面的每次反馈都始于事件。
实时校验
输入框每敲一个字触发一次 input，格式边写边查。
排查失灵
按钮点了没反应，先查监听器绑了没有、绑对了没有。
04 · 想一想
用一个问题检查理解
一个按钮点击后要同时更新计数并弹出提示。需要绑两个监听器吗？
查看答案
不用。一次 click 一个监听器就够了，处理函数里既可以更新计数也可以弹提示——事件是信号，收到信号后做几件事由处理函数决定。
最容易踩的坑
监听器是登记出来的，不是天生就有的。动态新增的元素不会自动继承监听；忘了解绑的监听器还会攒在内存里拖慢页面。