原生實現（零依賴）
現代瀏覽器支持 <dialog> 元素：
<dialog id="myModal">
<p>這是模態框內容</p>
<button onclick="document.getElementById('myModal').close()">關閉</button>
</dialog>
<button onclick="document.getElementById('myModal').showModal()">打開</button>
輕量級庫（專注彈窗）
UI 組件庫（含完整模態組件）
| 框架 | 模態組件 | 適用場景 |
|---|
| Bootstrap 5 |
Modal、Offcanvas、Toast |
後台管理、傳統多頁應用，依賴 Popper.js |
| Element Plus (Vue 3) |
ElDialog、ElDrawer、ElMessageBox |
Vue 生態企業級應用 |
| Ant Design (React/Vue) |
Modal、Drawer、message |
React/Vue 中大型項目 |
| Layui |
內置 layer 模塊 |
傳統 jQuery 多頁項目，無需構建工具 |
選型建議
- 純輕量彈窗 → Layer 或 SweetAlert2。
- 已用 UI 框架 → 直接用框架自帶組件（Bootstrap Modal、ElDialog 等）。
- 現代單頁應用（Vue/React）→ 配合框架生態組件庫。
- 無構建環境、快速原型 → Layui 或原生
<dialog>。
