Bootstrap 5移除jQuery依赖 Bootstrap 5如何不使用jQuery

<p>能，但必须改写初始化方式；Bootstrap 5 移除 jQuery 依赖，改用原生 DOM API 和 ES6+ 类构造器（如 bootstrap.Modal），data-bs-* 属性仍有效但需 DOM 就绪，事件绑定改为 addEventListener，方法调用变为实例方法。</p>Bootstrap 5 的 JavaScript 组件还能用吗？能，但必须改写初始化方式。bootstrap 5 彻底移除了对 jquery 的依赖，所有 js 组件（比如 modal、dropdown、toast）现在都基于原生 dom api 和 es6+ 语法实现。如果你之前靠 ().modal('show') 这类写法驱动组件，现在会直接报错：typeerror: is not a function。常见错误现象：页面加载后下拉菜单点不动、模态框不弹出控制台报 Uncaught ReferenceError: $ is not defined用 CDN 引入 Bootstrap 5 JS 后，data-bs-toggle 属性看似生效，但手动调用 JS 方法失败如何手动初始化 Bootstrap 5 组件？不再通过 jQuery 选择器链式调用，而是用 bootstrap 命名空间下的类构造器 + 原生 document.querySelector 或 querySelectorAll。实操建议：确保已正确引入 Bootstrap 5 的 JS 文件（不是旧版），且在你的脚本之前执行每个组件对应一个独立的类：如 Modal、Dropdown、Tooltip，全部从 bootstrap 模块导出（CDN 方式下挂载在全局 bootstrap 对象上）初始化前务必确认 DOM 已就绪，否则 querySelector 返回 null示例：手动触发模态框const myModal = document.getElementById('myModal')if (myModal) { const modal = new bootstrap.Modal(myModal) modal.show()}data-bs-* 属性还管用吗？管用，但有前提：你没动过默认行为，也没手动 new 实例覆盖它。Bootstrap 5 仍自动扫描并初始化带 data-bs-toggle 等属性的元素------前提是这些元素在 DOM 加载完成时已存在。 通义听悟 阿里云通义听悟是聚焦音视频内容的工作学习AI助手，依托大模型，帮助用户记录、整理和分析音视频内容，体验用大模型做音视频笔记、整理会议记录。