html全局属性是控制行为、可访问性和数据流的底层开关；mdn截至2026年4月明确定义约20个真正全局属性，如class、id、data-*、tabindex、contenteditable等，但需注意各属性的适用限制与使用规范。
HTML全局属性不是“锦上添花”的装饰，而是控制行为、可访问性和数据流的底层开关——用错一个，比如漏掉tabindex="0"就会让contenteditable彻底失焦；写错lang值可能让屏幕阅读器读成日语；data-属性名含大写字母或特殊符号，JavaScript里就取不到。
哪些属性真能用在所有标签上
截至2026年4月，MDN明确定义约20个真正全局属性，如class、id、data-*、tabindex、contenteditable、inert、popover等。但要注意：
-
contenteditable对<script></script>或<meta>无效，浏览器会静默忽略 -
hidden在里不生效（但也不报错） -
on*类属性（如onclick）不属于HTML规范定义的全局属性，是DOM接口暴露的事件处理器 -
style和data-*虽被广泛支持，但style未被MDN列为“规范全局属性”
contenteditable + tabindex 是硬绑定关系
contenteditable看似开个开关就行，但实际项目里80%的失效都源于没配对tabindex：
- 只写
contenteditable="true"→ 元素不可键盘聚焦，WCAG 2.1 2.1.1 失败 - 加了
tabindex="0"后，才真正进入 tab 流，支持el.focus()编程聚焦 - 误设
tabindex="1"或更高正数 → 会打断自然阅读顺序，对屏幕阅读器用户不友好 -
tabindex="-1"允许JS聚焦但不参与tab流，适合弹窗内手动触发场景 -
contenteditable合法值只有true、false、空字符串""；"plaintext-only"或"yes"会被忽略
data-*命名和读取的坑
data-是最常被滥用的全局属性之一，问题集中在命名和JS访问环节：
- 命名必须全小写，且只含字母、数字、连字符（
-）；data-userID或data-user_id都无效 - HTML中写
data-product-id="1001"，JS中必须用el.dataset.productId（自动转驼峰），不能写el.dataset["product-id"] - 值为空字符串时，
dataset仍会返回该键；但若属性根本不存在，访问结果为undefined - 不要用
data-存大量结构化数据（如JSON字符串），应改用JSON.parse(el.getAttribute('data-config'))显式解析 - 若属性名含数字开头（如
data-1st-place），JS中无法通过dataset.1stPlace访问，得用dataset["1st-place"]
title不是tooltip替代品
title是唯一零成本、原生支持无障碍的提示机制，但它能力极窄：
- 移动端（尤其iOS Safari）基本不触发悬停，不能当作主要交互手段
- 内容超过约120字符会被截断，且不支持换行、图标、富文本
- 若元素设置了
pointer-events: none，title完全失效——浏览器收不到事件 - 它不是视觉UI组件，而是无障碍提示通道；想做带样式的提示，得用
aria-describedby+role="tooltip"组合
真正容易被忽略的是：这些属性一旦设为false或off，就不会继承父级值——必须在目标元素上显式声明。比如spellcheck="false"写在<div contenteditable>上才有效，父容器设了也没用。</div>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
