bootstrap 5折叠失效主因是data-bs-toggle和data-bs-target属性写错或缺失，必须严格配对且id逐字符一致；未引入bootstrap.bundle.min.js、目标元素缺collapse类或css干扰max-height也会导致静默失效。
data-bs-toggle 和 data-bs-target 写错就完全没反应
Bootstrap 5 的 Collapse 组件根本不会监听 data-toggle 或 data-target，写错前缀等于没写。按钮能点击，DOM 没任何变化，控制台也安静得可怕——这是最典型的“静默失效”。
必须严格配对：
-
data-bs-toggle="collapse"（不能是data-bs="toggle"、data-toggle或漏掉bs-） -
data-bs-target="#myCollapse"（#开头，ID 必须与目标元素的id属性值**逐字符一致**：大小写、连字符、空格都不能差）
常见翻车点：data-bs-target="#mycollapse"（小写 c）、data-bs-target="#my-collapse "（末尾多空格）、href="#myCollapse"（Bootstrap 5+ 已不支持 href 触发）。
目标元素没加 collapse 类或 ID 不匹配
JS 不是靠 class 名“猜”目标，而是靠 data-bs-target 查找对应 id 的元素，再检查它是否含 collapse 类。两者缺一不可。
确保目标容器同时满足：
- 有
id="myCollapse"（和data-bs-target的值完全一致） - 有
class="collapse"（顺序无关，但不能漏；写成class="navbar-collapse"却没collapse就不行） - 初始状态不含
show类（否则一加载就展开，掩盖了 toggle 失效问题）
用浏览器开发者工具检查最终渲染的 HTML，别信编辑器里的模板——服务端渲染、JS 动态插入都可能让实际 DOM 和预期不一致。
bootstrap.bundle.min.js 没加载或加载太早
Collapse 是纯 JS 行为，只引 CSS 文件，它连动都不会动。而且 Bootstrap 5 的 JS 强依赖 Popper，必须用 bootstrap.bundle.min.js（不是 bootstrap.min.js），否则 collapse 实例根本初始化不了。
关键操作：
- 把
<script></script>标签移到
