bootstrap下拉菜单点击没反应，90%因bootstrap.bundle.min.js未加载成功或被换行截断；需检查network面板中js请求是否200、cdn链接是否完整、data-bs-toggle属性是否正确、.dropdown-menu是否为同级元素、动态内容是否手动初始化。
Bootstrap 下拉菜单点击没反应，90% 是因为 JavaScript 根本没跑起来——不是代码写错了，而是 bootstrap.bundle.min.js 没加载成功，或者压根没执行。
检查 bootstrap.bundle.min.js 是否真的加载了
下拉菜单依赖 JS 初始化，如果这个文件 404 或静默失败，data-bs-toggle="dropdown" 就只是个普通属性，毫无作用。
- 打开浏览器开发者工具 → Network 面板 → 刷新页面 → 筛选
bootstrap→ 看.js请求状态码是不是200 - 特别注意 CDN 链接是否被换行或空格截断（比如
https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js中间有回车或缩进，浏览器会把换行后的内容当空格处理，请求变成...min.js%20，直接 404） - 不要用
bootstrap.min.js替代bootstrap.bundle.min.js：前者不含 Popper，下拉菜单无法定位、无法展开
确认 HTML 中的 data-bs-toggle="dropdown" 写对了
Bootstrap 5+ 已彻底移除 jQuery 依赖，所有 data- 属性都改用 data-bs-* 前缀。写成 data-toggle="dropdown" 或 data-bs-toggle="dropdowm"（拼错）都会失效。
- 触发元素（按钮/链接）必须有
data-bs-toggle="dropdown" -
.dropdown-menu必须是它的同级兄弟元素，不能嵌在触发元素内部 - 确保没有 CSS 强制覆盖：
.dropdown-menu { display: none !important; }或pointer-events: none;会拦截点击
动态插入的下拉菜单需要手动初始化
如果 DOM 是 JS 动态生成的（比如通过 innerHTML、fetch 渲染后插入），Bootstrap 不会自动扫描新节点。原生属性不会自动生效。
- 插入完成后，显式调用：
new bootstrap.Dropdown(element)，其中element是带data-bs-toggle="dropdown"的触发器节点 - 别用
bootstrap.dropdown（小写 d）——构造函数名是大写的Dropdown - 若页面含 Vue/React，注意框架可能阻止事件冒泡，导致 Bootstrap 的 document 级 click 监听收不到关闭事件
别混用 Bootstrap 4 和 5 的加载逻辑
如果你看到网上教程说“先引 jQuery，再引 Bootstrap JS”，那基本是针对 Bootstrap 4 的。Bootstrap 5 完全不需要 jQuery，引入它反而可能引发冲突。
- Bootstrap 5 项目中出现
$ is not defined或控制台报 jQuery 相关错误，说明误留了旧版初始化代码（比如$('[data-toggle="dropdown"]').dropdown()） - 用
bootstrap@5.3.3（当前稳定版），别用alpha1或beta等测试版，路径不一致会导致 404 - 本地开发时，确认没同时引入
bootstrap.min.js和bootstrap.bundle.min.js：后者已包含前者 + Popper，重复引入可能干扰实例化
最容易被忽略的其实是 CDN 链接那一行是否真正完整——编辑器自动换行、复制粘贴带不可见字符、Cloudflare 邮箱混淆脚本插件意外截断 URL，都会让 JS 加载失败且控制台不报错。先盯住 Network 面板里的那个 bootstrap.bundle.min.js 请求，比反复改 HTML 结构更省时间。
