现代点击事件应统一用addeventlistener，支持多监听器、选项参数及精准清理；区分event.target与currenttarget；慎用preventdefault和stoppropagation；移动端优先用原生click或pointerdown，避免混用触发重复。
click 事件监听器必须用 addEventListener
直接写 onclick 属性或赋值 element.onclick = handler 虽然能工作，但会覆盖已有监听器，且不利于解耦和测试。现代写法统一用 addEventListener。
- 一个元素可绑定多个
click监听器，互不干扰 - 支持选项参数，比如
{ once: true }自动移除、{ passive: true }提升滚动性能（对 click 影响小，但习惯保持一致） - 必须用
removeEventListener手动清理时，传入的函数引用要完全相同（不能是箭头函数或匿名函数，除非提前定义）
事件对象 event 的 target 和 currentTarget 容易混淆
点击子元素触发父元素的 click 监听器时，event.target 是实际被点击的最深节点（比如按钮内的 <span></span>），而 event.currentTarget 是当前绑定监听器的那个元素（比如外层 <div>）。多数场景应优先用 <code>currentTarget 避免误判。
button.addEventListener('click', function (event) {
console.log(event.target); // 可能是 button 内的 i 标签
console.log(event.currentTarget); // 总是 button 元素本身
});
阻止默认行为和冒泡要分清场景
不是所有点击都要 event.preventDefault() 或 event.stopPropagation()。滥用会导致预期外行为：
-
preventDefault()：仅在需要取消浏览器默认动作时调用，例如点击<a href="#"></a>不跳转、表单提交前校验失败 -
stopPropagation()：只在明确不想让事件向上冒泡到父级时使用；若父级有全局点击关闭菜单逻辑，强行阻止会导致菜单关不掉 - 更安全的替代是检查
event.target类型，用条件逻辑分流，而不是一刀切阻止
移动端 click 有 300ms 延迟，但 modern 解决方案已很成熟
老式方案如 fastclick 库已基本淘汰。现在推荐两种方式：
立即学习“Java免费学习笔记（深入）”；
- 在
加<meta name="viewport" content="width=device-width, initial-scale=1">—— 这是启用原生快速点击的前提 - 改用
pointerdown或touchstart事件替代click，响应更快，但需注意 touch 事件坐标、多点触控等额外处理 - 如果只需兼容性兜底，
click在现代 WebView 和 Safari/Chrome for iOS 上已无延迟，不必过度优化
真正容易被忽略的是：同一元素上混用 click 和 touchstart 会触发两次回调（尤其在 iOS Safari），务必加防重复逻辑或统一事件源。
