JavaScript事件处理是网页响应用户操作的机制，核心包括事件源、事件类型和处理函数；主流绑定方式为onclick（单次覆盖）和addEventListener（多绑定、可控阶段）；事件流分捕获、目标、冒泡三阶段，常用preventDefault、stopPropagation等控制方法。
JavaScript中的事件处理，就是让网页对用户操作或浏览器
行为做出响应的机制。比如你点一下按钮、输几个字、滚动页面、按下回车——这些动作都会触发一个“事件”，而事件处理就是告诉浏览器：“当这事发生时，请执行我的代码”。
事件处理的核心是三要素
-
事件源：哪个元素被操作了（比如一个
） -
事件类型：发生了什么动作（比如
'click'、'input'、'keydown'） - 事件处理函数：要执行的具体逻辑（比如弹个提示、提交表单、改变颜色）
主流绑定方式有两种
-
element.onclick = function() { ... }
简单直接，但一个元素同类型事件只能绑一个，后绑会覆盖前绑 -
element.addEventListener('click', handler, false)
推荐使用，支持同一元素绑定多个相同事件，可选捕获或冒泡阶段，更灵活可控
事件不是孤立发生的，它会流动
点击一个按钮，事件其实会经过三个阶段：
- 先从
window往下传（捕获阶段） - 到达那个按钮本身（目标阶段）
- 再从按钮往上传到
body、html、document（冒泡阶段）
大多数日常交互都发生在冒泡阶段，这也是事件委托能生效的基础。
常用控制方法
-
event.preventDefault()：阻止默认行为（比如不让表单提交、不让链接跳转） -
event.stopPropagation()：停止向上冒泡（避免父级监听器也被触发） -
event.stopImmediatePropagation()：连同级其他监听器也一并跳过
基本上就这些。写得清楚、绑得合理、流得明白，事件处理就不难。
