document.getelementsbyclassname 返回htmlcollection，需传入无前缀类名（如'header'），支持空格分隔多类名表示同时拥有，可用索引或for循环访问元素。
document.getElementsByClassName 是 JavaScript 中用于根据类名获取元素集合的原生方法，它返回一个 HTMLCollection（类似数组的实时集合），包含所有具有指定类名的元素。
基本用法：传入类名字符串
只需传入一个类名（不带点号 “.”），即可获取页面中所有匹配该类名的元素：
- 类名是字符串，不能加前缀（如
.header错误，应写'header'） - 支持多个类名，用空格分隔，表示“同时拥有这些类”的元素（如
'btn primary'） - 返回的是 HTMLCollection，不是数组，不能直接用
map、filter等数组方法
获取单个或遍历多个元素
由于返回的是 HTMLCollection，常用操作包括：
- 通过索引访问：例如
elements[0]获取第一个匹配元素 - 用
for循环遍历：for (let i = 0; i - 转为数组再操作：用
Array.from(elements)或[...elements]（ES6 展开语法）
注意点：大小写敏感 & 实时性
该方法对类名大小写敏感，且返回的 HTMLCollection 是实时的（live）：
- 如果后续 DOM 动态添加/删除了匹配类名的元素，集合内容会自动更新
- 这意味着在循环中修改 DOM（如移除当前元素）可能影响后续遍历，建议先转成静态数组再处理
- 若类名含空格或特殊字符，需确保 HTML 中 class 属性书写一致（如
class="my-class"对应getElementsByClassName('my-class')）
替代方案：更灵活的 querySelectorAll
如需更强表达力（比如组合选择器、伪类、或返回静态 NodeList），推荐使用：
-
document.querySelectorAll('.header')—— 支持 CSS 选择器语法，返回静态 NodeList -
document.querySelectorAll('.btn.active')—— 查找同时有 btn 和 active 类的元素 -
document.querySelector('.header')—— 只取第一个匹配元素（返回单个 Element）
