alert() 无法设置危险警示级别，因其是浏览器强制统一的阻塞式原生方法，不支持样式、图标或参数配置；实际需用自定义模态框或 SweetAlert2 等库实现 error/warn/info 分级提示。
HTML 本身没有“警告对话框的危险警示级别”这个概念——alert() 就是单一、无样式、无配置项的原生弹窗，无法设置级别、颜色、图标或行为差异。
为什么 alert() 不能配级别
浏览器强制统一实现：alert() 是 ECMAScript 规范定义的阻塞式全局方法，只接受一个字符串参数。所有参数都会被强制转为字符串，传入第二个参数（比如 alert("msg", "error")）会被忽略；任何试图通过 CSS 或属性修改它的尝试都无效——它不属于 DOM 树，无法被选择或样式化。
实际项目中怎么实现多级警告（error/warn/info）
必须放弃 alert()，改用自定义模态框。核心思路是：用 HTML+CSS 构建容器，用 JavaScript 控制显隐和内容，并按语义区分 class 名来驱动样式与行为：
-
class="alert alert-error"→ 红色背景 + ⚠️ 图标 + 自动聚焦 + 禁止点击遮罩关闭 -
class="alert alert-warning"→ 橙色背景 + ⚠️ 图标 + 可点击遮罩关闭 -
class="alert alert-info"→ 蓝色背景 + ℹ️ 图标 + 3 秒后自动消失
示例最小结构：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
<div id="custom-alert" class="alert alert-warning"> <span class="alert-icon">⚠</span> <span class="alert-text">配置未保存，确定离开？</span> <button onclick="closeAlert()">取消</button> <button onclick="confirmLeave()" class="alert-confirm">离开</button> </div>
用现成库快速支持多级提示（推荐方案）
自己写易出兼容/可访问性问题，直接用轻量库更稳妥。注意选支持语义 class 和 keyboard 导航的：
-
Sweetalert2：调用Swal.fire({ icon: 'error', title: '失败', text: '网络超时' })，icon值可为'error'/'warning'/'info'/'success' -
Notyf：专注非模态提示，notyf.error('删除失败')/notyf.warning('即将过期')，不阻塞用户操作 - 避免用已停止维护的
bootbox.js或强依赖 jQuery 的方案
所有这些库底层仍是 div+CSS，但封装了焦点管理、ESC 关闭、Aria 属性、过渡动画等细节——而原生 alert() 连屏幕阅读器提示都不可控。
真正要注意的不是“怎么配级别”，而是“什么时候该用阻塞式（modal）警告，什么时候该用非阻塞式（toast）提示”。前者用于不可逆操作确认（如删除），后者用于状态反馈（如保存成功）。混淆这两者，再花哨的图标也救不了体验。
