title在移动端基本无效，因iOS Safari不支持hover触发，Android浏览器长按也极难显示，且无焦点管理、不可键盘操作，用户无法点到、看到或读出。
直接加 title 不等于提升体验，多数场景下它反而会失效或干扰可访问性。
为什么 title 在移动端基本没用
iOS Safari 完全不支持 hover 触发 title，Android 浏览器也只在长按后极小概率显示，且无焦点管理、不可键盘操作。用户根本点不到、看不到、读不出。
- 写
<div title="删除">?</div>，桌面端悬停可能出提示，移动端完全静默 - 若元素本身不可聚焦（如默认
<div>），旧版 Safari 还要求显式加 <code>tabindex="0"才能触发，但加了又会让该元素进入 tab 流，破坏导航逻辑 -
title内容超 120 字符会被截断，不支持换行、HTML 或样式，纯文本能力极弱 - 必须同时加
tabindex="0"，否则contenteditable形同虚设 - 合法值只有
"true"、"false"和空字符串；contenteditable="on"或contenteditable="plaintext-only"是无效写法，浏览器忽略 - 编辑完成后不会自动触发
input或change事件，需监听blur或手动节流input - 若子元素含
user-select: none或pointer-events: none，会阻断光标定位，需一并清理 - 推荐用
data-id="123"+querySelector('[data-id="123"]')替代id="item-123" -
dataset读取时自动转驼峰：HTML 中data-user-role="admin"→ JS 中为el.dataset.userRole，不是el.dataset.userrole - 属性名不能以数字开头（如
data-1st-place），JS 中必须用el.dataset["1st-place"]访问，否则语法错误 - 所有
data-*值都是字符串，data-count="0"取出来是"0"，需手动转类型 -
lang="zh-CN"让 Chrome 拼写检查启用中文词典，Safari 朗读时用普通话声调 -
dir="rtl"不仅翻转文本方向，还改变text-align: start/end的含义，影响布局稳定性 - 嵌套元素可单独设
lang，如<p lang="en">英文段落中引用<span lang="ja">日本語</span></p>，辅助技术能准确切换语言模型 - 漏设
lang会导致 SEO 工具误判页面语言，影响多语言站点收录
contenteditable + tabindex 必须配对使用
设 contenteditable="true" 后，元素内容虽可编辑，但默认不可聚焦——键盘进不去、光标点不进去，用户无法开始输入。
用 data-* 替代 id 做列表项标识更安全
动态渲染列表时，重复 id 是高频错误源：document.getElementById() 只返回第一个匹配节点，且 HTML 验证器不报错、JS 也不抛异常，问题极难定位。
立即学习“前端免费学习笔记（深入）”；
lang 和 dir 不只是“多此一举”
它们直接影响拼写检查、字体回退、文本换行、屏幕阅读器语调，甚至影响某些 CSS 伪类（如 :dir(rtl)）的行为。
真正影响体验的不是属性数量，而是每个属性是否在正确上下文中被正确赋值——比如 tabindex 设成正数会打乱默认焦点顺序，hidden 用在 <script></script> 上完全无效，draggable 默认是 "auto" 而非 "true"。细节不校验，交互就不可靠。
