优先用 querySelector，它更灵活；getElementById 仅 ID 查找且性能敏感时略快；二者均需检查返回值或确保 DOM 加载完成；事件一律用 addEventListener，支持多次绑定、捕获/冒泡控制及 once 选项；动态元素用事件委托；修改内容优先 textContent 防 XSS，innerHTML 需过滤；操作前须确认元素存在、及时清理监听器、避免异步操作已销毁节点。
JavaScript 操作 DOM 和处理事件本身不难，难在选错方法、忽略事件流、或没处理好元素不存在的边界情况。
用 querySelector 还是 getElementById？
优先用 querySelector，它更灵活，支持 CSS 选择器语法；但若只按 ID 查找且性能敏感（比如高频循环中），getElementById 略快且语义明确。
-
querySelector返回第一个匹配项，querySelectorAll返回 NodeList（不是数组，需用[...nodeList]或Array.from()转换才能用map/forEach） -
getElementById参数不带#，而querySelector('#id')必须带 - 如果元素还没加载完就调用，两者都返回
null—— 务必检查返回值，或把脚本放在
