bootstrap警告框无自动关闭功能，其“失效”源于定时逻辑中断；需确保dom就绪后再查询元素，避免close()销毁dom导致无法复用，应改用classlist控制显隐。
Bootstrap 警告框（alert）本身**没有自动关闭功能**，所谓“失效”，其实是你写的定时逻辑断了——不是框架坏了，是脚本没跑起来、元素被删了、或者选错了方法。
document.querySelector 找不到 .alert 元素
常见错误现象：setTimeout 一执行就报 Cannot read property 'close' of null；页面刚加载时警告框闪一下就消失，或根本没反应。
- 根本原因是 DOM 还没就绪，
document.querySelector('.alert')返回null - 别在脚本顶部直接执行查询，必须等
DOMContentLoaded或用$(function(){})（jQuery 环境） - 避免宽泛选择器：如果页面有多个
alert，用document.getElementById('form-success-alert')替代document.querySelector('.alert')，防止只关掉第一个 - HTML 中的
alert必须已存在（不能是 JS 动态插入后才加的），否则初始化失败
调用 alert.close() 后再也不能显示
这是最常被忽略的坑：Bootstrap 5 的 close() 方法会把整个 alert 元素从 DOM 中 remove() 掉，不是隐藏。
- 后果：下次想用
alertEl.classList.remove('d-none')显示它？元素已经不存在了 - 如果你需要复用同一个警告框（比如表单提交成功反复弹），必须放弃
close() - 正确做法：去掉
data-bs-dismiss="alert"按钮，改用纯类名控制显隐 —— 显示前alertEl.classList.remove('d-none', 'show')，再加新类型和show；隐藏时只加d-none - 确保 CSS 里有
.alert.fade { transition: opacity .15s linear; }，否则加d-none是硬切，没有淡出动画
alert.hide() 或 alert.close() 不触发动画
元素瞬间消失，没淡出效果，用户感知突兀。
- 原因：HTML 缺少必要类 ——
alert必须同时有fade和show（Bootstrap 5）或in（Bootstrap 4） - 别删
data-bs-dismiss="alert"按钮（即使不用它点击关闭）：这个属性负责初始化 Alert 实例，删了会导致close()失效 - 用
bootstrap.Alert.getOrCreateInstance(alertEl)替代new bootstrap.Alert(alertEl)，避免重复初始化异常 - 如果倒计时中用户手动点击关闭按钮，记得在
closed.bs.alert事件里clearTimeout(timerId)，防内存泄漏
真正难处理的不是怎么关，而是关完还能不能再用。如果你的场景要求警告框可多次弹出，就别碰 close() —— 它的设计定位就是一次性销毁组件。用 classList.add/remove('d-none') 控制显隐，才是稳住 DOM 结构的底线操作。
