非法事件名导致addEventListener静默失败，需校验空值、字符范围及高频错误；推荐用MDN标准列表、常量约束和绑定后自检确保有效性。
直接传入非法事件名（比如拼写错误、空字符串、含特殊字符的字符串）不会让脚本“瘫痪”，但会导致 addEventListener 静默失败——监听器根本没绑上，后续点击/滚动等行为毫无响应，排查起来非常隐蔽。关键不是防崩溃，而是防“看似正常却失效”。
只使用浏览器支持的标准事件类型
非法事件名最常见于手误或复制粘贴错误，例如把 'click' 写成 'clk'，把 'input' 写成 'oninput'（带 on 前缀是 HTML 属性写法，JS 中不用），或误用自定义事件却未触发它。
- ✅ 推荐做法：优先查阅 MDN 官方事件参考列表（如 MDN Web Events），只使用明确列出的事件名
- ⚠️ 注意：
'DOMContentLoaded'、'load'、'error'等全局事件名大小写敏感，不能写成'domcontentloaded' - ❌ 避免凭记忆硬编码，尤其跨浏览器时——比如
'mousewheel'已废弃，应改用'wheel'
对事件名做基础校验再绑定
不依赖运行时报错，主动拦截明显非法输入。适用于从配置、接口或用户输入中动态获取事件名的场景。
- 检查是否为空字符串、
null或只含空白符：if (!eventName?.trim()) return; - 限制字符范围：仅允许字母、数字、连字符、下划线（覆盖标准事件和合理自定义事件）：
/^[a-zA-Z0-9_-]+$/.test(eventName) - 可选增强：对已知高频错误做提示，例如检测到
startsWith('on')就 warn 一次
绑定后验证监听是否实际生效（进阶）
某些环境（如 Shadow DOM、iframe 跨域、或被第三方脚本劫持）可能导致 addEventListener 调用成功但监听无效。可借助 getEventListeners（仅限 Chrome/Firefox DevTools）辅助调试，但生产环境不可依赖。
- 更实用的方法：在绑定后立即触发一次对应事件（如用
element.dispatchEvent(new Event('click'))），观察回调是否执行 - 对关键交互（如提交按钮），可加一层 fallback 检测：若 2 秒内无预期响应，提示“功能异常，请刷新重试”
- 避免在生产代码中频繁调用
dispatchEvent，仅用于初始化后的快速自检
用常量或类型约束杜绝拼写错误
在 TypeScript 项目或大型 JS 工程中，把事件名收归为常量对象，配合 IDE 自动补全和编译检查，从源头消灭 typo。
- 示例：
const EVENTS = { CLICK: 'click', INPUT: 'input', SUBMIT: 'submit' } as const; - 调用时写
el.addEventListener(EVENTS.CLICK, handler)，拼错会立刻报错 - 即使纯 JS，也可用
Object.freeze({ click: 'click', input: 'input' })提高可维护性
