HTMLCollection基本均为动态集合，而NodeList分静态与动态：querySelectorAll返回静态快照，childNodes返回动态集合；判断依据是创建方式而非接口名称，动态集合随DOM实时更新，静态集合则固定不变。
HTMLCollection 和 NodeList 的静态与动态特性，关键看它怎么来的，而不是叫什么名字。同一个接口类型，不同来源可能行为完全不同。
HTMLCollection 基本都是动态的
所有通过 getElementsByClassName()、getElementsByTagName()、getElementsByName()（注意不是 getElementById）等方法返回的 HTMLCollection，都是动态集合。
- DOM 中增删匹配的元素，集合的 length 和内容会立刻变化
- 比如用
document.getElementsByTagName('div')获取后，再插入一个<div></div>，集合长度自动 +1 - 不能用
forEach，也不支持数组方法，但可以用for循环或展开语法[...collection]
NodeList 分两种：绝大多数是静态的，只有 node.childNodes 是动态的
这是最容易混淆的一点：NodeList 不是统一行为，要看创建方式。
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
- document.querySelectorAll() 返回的是静态 NodeList —— 快照式结果，后续 DOM 变化不影响它
- node.childNodes 返回的是动态 NodeList —— 子节点一变，它立刻反映（包括文本节点、注释节点等）
- node.children 返回的是 HTMLCollection（不是 NodeList），只含元素节点，且是动态的
怎么快速判断一个集合是否动态
最可靠的办法是做一次“现场测试”：先获取集合，再增删一个符合条件的元素，再检查 length 或索引项是否改变。
立即学习“Java免费学习笔记（深入）”；
- 动态集合：第二次读
coll.length会变；coll[0]可能指向新节点 - 静态集合：两次读值一致，像拍下的照片一样固定
- 注意避免在循环中直接操作动态集合（如边遍历边
remove()），容易跳过或重复处理
需要操作时的通用处理建议
不管动态还是静态，只要想用数组方法（map、filter、forEach），都建议先转成真数组。
- 推荐写法：
Array.from(nodeList)或[...htmlCollection] - 兼容旧环境可选：
Array.prototype.slice.call(collection) - 现代浏览器中，静态 NodeList 支持原生
forEach，但动态 NodeList（如 childNodes）在部分老版本里不支持，统一转数组更稳妥
