布尔属性如disabled只需写属性名即生效，删掉即失效；disabled="false"等写法错误；required等同理，但contenteditable必须显式赋值true/false；hidden是布尔属性，contenteditable是枚举属性；data-*需小写短横，JS中转驼峰访问。
布尔属性写 disabled 就生效，别加等号和值
只要标签里出现 disabled 这个词，浏览器就当它是 true；删掉它，才是 false。写成 disabled="false"、disabled="" 甚至 disabled="disabled" 都是多余操作——前两者语义错误（disabled="false" 依然禁用），后者是旧式冗余写法。
常见错误现象包括：表单提交时校验跳过、SSR 渲染后 hydration mismatch、W3C 验证器报“非标准值”。
-
required、checked、readonly、open、hidden、contenteditable（注意：这个必须显式写contenteditable="true"或"false"，它不是纯布尔属性）都遵循同一规则 - autocomplete、spellcheck、draggable 不是布尔属性，必须带值，比如
autocomplete="off"、spellcheck="false" - 验证方法：在 Chrome DevTools 的 Elements 面板里右键“Edit as HTML”，删掉某个属性看行为是否变化；变，大概率是布尔属性
JS 动态控制 disabled 要赋值 DOM 属性，别碰 setAttribute
HTML 属性（attribute）和 DOM 属性（property）不是一回事。disabled 在 HTML 中只管初始状态，运行时起效的是 element.disabled 这个 JS 属性。
- ✅ 正确启用：
btn.disabled = false - ✅ 正确禁用：
btn.disabled = true - ❌ 错误做法：
btn.setAttribute('disabled', '')或btn.setAttribute('disabled', 'false')—— 它们无法恢复启用状态 - 检查是否禁用，用
if (btn.disabled)，别用btn.hasAttribute('disabled')，后者可能滞后于真实状态
hidden 和 contenteditable 容易混淆，但行为完全不同
hidden 是纯布尔属性：存在即隐藏（等效于 display: none），不渲染、不占空间、不影响焦点流；删掉就显示。而 contenteditable 是枚举属性，必须显式赋值 "true" 或 "false"，写成 contenteditable 或 contenteditable="" 会被当作 "true" 处理（规范允许空值表示 true，但不推荐）。
立即学习“前端免费学习笔记（深入）”；
-
hidden：只写hidden，或完全不写；值无效，hidden="false"依然隐藏 -
contenteditable：必须写contenteditable="true"/contenteditable="false"；contenteditable="0"或contenteditable="off"无效 - 两者都支持继承：父元素设了
contenteditable="false"，子元素即使没声明也会不可编辑；hidden不继承，每个元素独立控制
data-* 命名要小写+短横，JS 读取自动转驼峰
data-user-id 写在 HTML 里没问题，但在 JS 中必须通过 element.dataset.userId 访问，不是 element.dataset.userid 或 element.dataset["user-id"]。
- 连字符会转为驼峰：
data-api-key→dataset.apiKey，data-abc-def-ghi→dataset.abcDefGhi - 值永远是字符串：
data-count="42"对应dataset.count === "42"，需要手动parseInt() - 别用
data-存大量结构化数据；JSON 字符串可读性差，建议改用<script type="application/json">块
