dataset读不到data-userId是因为命名不规范：必须全小写加连字符，如data-user-id才合法，驼峰、下划线或大写均被忽略，导致element.dataset.userId返回undefined。
dataset 是 DOM 元素上读写 data-* 属性的首选接口，但它不是万能的数据桥——它只适合传轻量、静态、公开的上下文信息，不是状态管理器，也不是安全容器。
为什么 dataset 读不到你写的 data-userId
浏览器只解析符合规范的 data-* 属性：全小写 + 连字符。写成 data-userId、data_user_id 或 data-UserID 都会被忽略，element.dataset.userId 永远返回 undefined。
- 正确写法必须是
data-user-id→ JS 中通过element.dataset.userId访问 - 含数字开头的（如
data-2024-year）不能用点号访问，得写element.dataset["2024Year"] - 属性名里有双连字符（
data-foo--bar）会被转成fooBar，但语义模糊，不建议用
dataset 赋值后 HTML 没变？
dataset 是只读代理，赋值如 el.dataset.foo = "bar" 只改了内存副本，不会同步到 DOM 属性。刷新页面或重新序列化 HTML 后，原始值照旧。
- 真正要持久化，必须调用
el.setAttribute('data-foo', 'bar') - 混用会出问题：
el.dataset.foo = "a"再el.setAttribute('data-foo', 'b')，后续el.dataset.foo仍返回"a"（缓存未更新） - 删除推荐用
delete el.dataset.foo，比el.removeAttribute('data-foo')更安全
JSON 存进 data-config 为什么 dataset.config 不是对象？
dataset 的所有值恒为字符串。哪怕你写 data-count="0"，el.dataset.count + 1 也会变成 "01"；存 JSON 更得手动处理。
- 写入前先
JSON.stringify()：el.setAttribute('data-config', JSON.stringify({theme: 'dark'})) - 读取时必须
try/catch：const config = JSON.parse(el.getAttribute('data-config') || '{}') - 服务端渲染时，JSON 字符串需做 HTML 实体编码（如
"），否则前端JSON.parse()直接报SyntaxError
事件委托里怎么安全拿到 data-action
点击按钮里的图标或文字，event.target 往往不是你加了 data-action 的那个元素，而是它的子节点。
立即学习“前端免费学习笔记（深入）”；
- 别直接用
event.target.dataset.action，大概率是undefined - 改用
event.target.closest('[data-action]')向上找最近的匹配祖先 - 拿到元素后，再校验存在性：
if (!el) return; const action = el.dataset.action; - 高频触发场景（如拖拽、滚动）避免在回调里反复调
closest，可提前绑定到父容器并把data-*放在父级
data-* 值都是明文字符串，没有类型、没有自动解析、没有安全封装。它只是个标签，不是数据管道。 
