不合法的布尔属性指HTML标准未定义为布尔类型的属性（如spellcheck、draggable="auto"、data-*），硬按布尔方式处理会导致行为异常；spellcheck是枚举属性，必须显式写为spellcheck="true"/"false"，写成spellcheck或spellcheck=""均无效且跨浏览器表现不一致。
什么是“不合法的布尔属性”
浏览器只认 HTML 标准里明确定义的布尔属性（如 disabled、hidden、required），其他看似像布尔的写法，比如 spellcheck="false"、draggable="false"、data-active="true"，要么是枚举属性（值有意义），要么是自定义属性（值不能省），硬按布尔方式处理会出逻辑偏差。常见表现是：JS 用 toggleAttribute 切换后行为反常，或服务端解析时把 data-id=123 当成布尔丢了值。
哪些属性必须保留引号或显式值
以下三类属性一旦去掉引号或误写成无值形式，就属于“不合法布尔化”，需清理：
-
spellcheck是枚举属性，合法值只有"true"或"false"；写成spellcheck或spellcheck=""会导致行为不可控 -
draggable在旧版 Safari 中对toggleAttribute支持不全，但本身是布尔属性；若模板里混着draggable="auto"就不是布尔用法，得统一为显式值 -
data-开头的属性一律不是布尔属性，data-expanded有效，data-expanded=""会丢失语义（比如 JS 依赖dataset.expanded === "true"）
用正则批量识别并修复
手动扫 HTML 文件效率低，可用以下正则定位典型非法模式（在 VS Code 或脚本中执行）：
/\s+(spellcheck|draggable|contenteditable|aria-\w+)\s*(?=\s*\/?>|>|\s+[a-zA-Z])/gi
这个表达式能抓出所有「疑似布尔但没等号」的属性名，再人工确认是否该补值。更稳妥的是匹配带非法空值的写法：
/\s+(spellcheck|draggable|aria-\w+)\s*=\s*["']{0,1}["']{0,1}\s*(?=\s*\/?>|>)/gi
匹配到 spellcheck="" 或 aria-hidden= 这类，就得替换成 spellcheck="false" 或 aria-hidden="true"。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
注意：contenteditable 是布尔属性，但部分编辑器会动态设为 contenteditable="plaintext-only" —— 这种属于合法枚举用法，不能强行改成布尔形式。
为什么不能全用 toggleAttribute 一键清理
toggleAttribute 只对标准布尔属性安全，对它乱用反而制造问题：
- 对
spellcheck调用el.toggleAttribute('spellcheck')会生成spellcheck=""，而 Chrome 把它当"true"，Firefox 当"false" - 对
data-loading调用toggleAttribute会留下data-loading=""，后续dataset.loading取出来是空字符串，不是undefined，破坏判断逻辑 - IE 完全不支持
toggleAttribute，若清理脚本跑在老环境里，直接报错
真正要清理，得先分类：标准布尔属性可删可留；枚举属性必须带合法值；data- 属性必须带引号和非空值。最易被忽略的是——你以为在“清理”，其实是在给模板埋跨浏览器兼容雷。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
