id和class是唯二真正高频影响JS选择与CSS匹配的全局属性；data-*仅JS中通过dataset读写有效，tabindex需为0或正整数才参与焦点流，hidden和contenteditable为布尔属性，存在即生效、值无效。
id 和 class 是唯二真正高频影响 JS 选择与 CSS 匹配的全局属性；其余多数要么只在特定场景生效，要么“写了等于没写”。
哪些全局属性真正在运行时起作用
别被“所有标签都能加”误导。浏览器对全局属性的解析有明确边界，不是所有属性都会触发行为或样式：
-
id和class：JS 用getElementById或querySelector依赖它们；CSS 选择器必须匹配才生效 -
data-*：只在 JS 中通过dataset读写有意义，HTML 和 CSS 完全不解析它 -
tabindex：值为0或正整数才参与 Tab 焦点流；负值（如-1）仅禁用焦点，不改变顺序 -
hidden和contenteditable是布尔属性：存在即生效，值无效——hidden="false"依然隐藏，contenteditable="0"也等同于true
class 和 id 最容易翻车的三个地方
这两个看似最简单，恰恰是动态渲染和调试中最常出问题的点：
- 多个元素用了相同
id：getElementById只返回第一个，后续逻辑全错；CSS 选择器仍会命中全部，造成样式覆盖混乱 -
class值含空格却没引号：<div class="btn" primary></div>实际只生效btn，primary被当作文本节点丢弃 - 动态拼接
class时没做去重：el.className += " active"多次执行导致active active active，CSS 仍生效但classList.contains("active")判断会出错
data-* 属性的读写陷阱
它看着自由，但浏览器处理时有隐式规则，踩坑后很难 debug：
立即学习“前端免费学习笔记（深入）”；
- 连字符自动转驼峰：
data-user-id="123"→ JS 中必须用dataset.userId访问，dataset.user-id是语法错误 - 数字开头的 key 会被忽略：
data-1st-place="gold"在dataset中不可见 - IE11 支持
dataset，但不支持带大写字母的转换（data-MyKey→mykey，不是myKey） - 不要存大对象或函数：它只序列化为字符串；若塞了
JSON.stringify(obj)，取出来得自己JSON.parse
title、lang、aria-* 这类“隐形属性”的真实代价
它们不改样式、不触发行内逻辑，但缺失会导致具体可测的问题：
-
title：鼠标悬停显示提示，但不保证一定出现——移动端 Safari 完全不支持，部分屏幕阅读器默认忽略 -
lang：影响语音合成、断字（hyphenation）、字体回退，缺失时多语言页面朗读会错乱 -
aria-*：不是“锦上添花”，而是无障碍访问的硬性依赖；缺了aria-label或aria-hidden，视障用户可能完全无法操作组件
最容易被忽略的是：这些属性一旦写错格式（比如 aria-labelledby 指向一个不存在的 id），不会报错，但无障碍功能直接失效——你测不出，用户却卡住。
