JavaScript事件是浏览器对用户操作或系统状态变化的通知机制，本身不执行逻辑，只触发绑定的函数；常用绑定方式为addEventListener，需注意避免立即执行函数、区分event.target与currentTarget，并排查DOM未加载等常见问题。
JavaScript 事件到底是什么
JavaScript 事件不是“某个东西发生了”，而是
浏览器
对用户操作或系统状态变化的**通知机制**。比如用户点按钮、页面加载完成、键盘按下、网络请求返回，这些都会触发对应事件。它本身不执行逻辑，只负责“喊一声”——真正干活的是你绑定的函数。
给按钮绑点击事件的三种常用方式
别用
HTML 属性写死逻辑，维护性差、无法动态控制。优先选以下方式：
：推荐，支持多次绑定、可移除、语义清晰
：简单但会覆盖之前赋值，仅适合单次快速调试
用
或
先拿到按钮元素，再绑定——不能对未挂载的 DOM 调用
常见错误：
—— 这里多写了括号，导致函数立即执行，而不是点击时执行。正确写法是
（不带括号）。
点击事件对象里有哪些关键信息
回调函数
接收一个
参数，它不只是“告诉你是谁被点了”，还包含大量实用字段：
立即学习
“
Java免费学习笔记（深入）
”；
Comet AI 浏览器
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
：实际被点击的元素（可能是按钮里的
，不是按钮本身）
：绑定事件的那个元素（即你调用
的那个）
：阻止默认行为，比如点击
时不跳转
：阻止
事件冒泡
，避免父级监听器也被触发
示例中常忽略
和
区别，结果在按钮含子元素时逻辑出错。
为什么点击没反应？检查这几个点
90% 的“点不动”问题不是语法错，而是环境或时机问题：
脚本执行时 DOM 还没加载完 → 把 JS 放在
onclickelement.addEventListener('click', handler)element.onclick = handlerdocument.querySelectorgetElementByIdaddEventListenerdocument.getElementById('btn').addEventListener('click', myFn())myFneventevent.targetevent.currentTargetaddEventListenerevent.preventDefault()event.stopPropagation()targetcurrentTargetconst btn = document.getElementById('submit-btn');
btn.addEventListener('click', function(event) {
console.log('target:', event.target); // 可能是内部的 i 标签
console.log('currentTarget:', event.currentTarget); // 一定是 #submit-btn
event.preventDefault(); // 如果按钮在 form 里，这行能防止页面刷新
});