getElementById 只能用 ID，因其直接查 DOM 树的 ID 索引表，不解析 CSS 选择器语法，故传入空格、点号或井号均返回 null；HTML ID 大小写敏感，重复 ID 时仅返回首个，属非法 HTML。
getElementById 为什么只能用 ID？
getElementById 是唯一一个不走 CSS 选择器引擎的 API，它直接查 DOM 树的 ID 索引表，所以快、准、只认 id 属性值（且必须是全局唯一）。一旦传入的字符串含空格、点号或井号，它不会报错，但返回 null——因为它根本不解析选择器语法。
- ID 值带前缀如
user-123没问题，但#user-123或.user就会失效 - 不区分大小写？错，HTML ID 是大小写敏感的，
getElementById("Header")找不到id="header" - 多个元素用了同一个
id？浏览器通常只返回第一个，但这是非法 HTML，别依赖
querySelector 和 querySelectorAll 的选择器陷阱
querySelector 和 querySelectorAll 共享同一套 CSS 选择器逻辑，但行为差异极大：前者只返回第一个匹配项（null 表示没找到），后者返回 NodeList（即使为空也是真 NodeList）。
-
document.querySelector("div p")匹配后代，document.querySelector("div > p")才是子元素 - 伪类如
:hover或:nth-child(2n)能用，但:focus只在真实聚焦时才匹配，脚本里调用基本无效 - 动态插入的节点，只要已挂载到 DOM，就能被立刻查到；但若还在内存中未 append，查不到
-
querySelectorAll(".btn[data-loading]")可以查带属性的元素，但querySelectorAll("[data-loading=true]")要求值完全相等，不推荐用布尔属性写法
getElementsByClassName 和 getElementsByTagName 返回的是“活”的集合
getElementsByClassName 和 getElementsByTagName 都返回 HTMLCollection，特点是「动态实时」：DOM 变了，集合内容自动更新。这和 querySelectorAll 返回的静态 NodeList 完全不同。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 写
for (let i = 0; i < els.length; i++) { els[i].remove(); }会漏删——因为每次remove()后els.length实时减小，下标错位 - 正确做法是倒序遍历，或先转成数组：
[...els].forEach(el => el.remove()) -
getElementsByClassName("a b")查的是同时含 classa和b的元素，不是查a下的b -
getElementsByTagName("*")返回所有元素，但性能差，现代代码尽量避免
为什么 document.getElementsByName 在现代项目里几乎不用
getElementsByName 只对具有 name 属性的表单控件（input、select、textarea、button、form）有效，且返回 NodeList（注意：不是 HTMLCollection）。它的语义是“表单数据提交时的字段名”，不是通用查找手段。
立即学习“前端免费学习笔记（深入）”；
-
<div name="foo"></div>不会被选中，哪怕加了name属性也没用 - 在 iframe 中调用需注意上下文：
iframe.contentDocument.getElementsByName(...) - 多个同名
input type="radio"会归为一组，适合批量操作，但日常 DOM 查找更常用querySelector
容易被忽略的一点：这些 API 全部只在当前节点作用域内搜索，el.getElementById(...) 是无效的——getElementById 只属于 document，其他节点只能用 querySelector 系列。
