data-属性应优先绑定在上，命名须严格遵循kebab-case规则，读取时需手动类型转换，动态更新必须用setAttribute而非dataset赋值，复杂状态应交由专门状态管理。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
直接在 <tr>、<code><td> 或 <code><tbody> 上写 <code>data- 属性就行，但表格结构特殊，容易因元素复用、动态渲染或命名不规范导致读不到值——关键不是“能不能写”，而是“怎么写才真能拿到”。
data-属性写在哪一行/单元格上才有效
表格中存数据，优先绑定到 <tr> 元素，而不是 <code><td>。因为单行数据通常有完整语义（如用户记录），而单元格只负责展示局部字段；若把 <code>data-user-id 写在 <td> 里，后续查某行 ID 就得遍历所有 <code><td>，逻辑松散且易错。
<ul>
<li>
<code><tr data-user-id="1024" data-status="active">...</tr> → 推荐，语义清晰，一行一记录
<td data-order-id="789">Apple</td> → 可用但不推荐，除非该字段确实只属于这个单元格（如“操作列”里的编辑按钮）<tbody data-api-endpoint="/api/orders"> → 合理，适合存整张表的上下文配置
<li>避免写在 <code><table> 根节点上存行级数据，会丢失粒度，也不利于事件委托定位
<h3>dataset 读取时返回 undefined 的真实原因</h3>
<p>表格行里写了 <code>data-user-id="1024"，但 tr.dataset.userId 是 undefined？大概率是属性名写错了。浏览器对 data- 命名极其严格，表格结构不会放宽规则。
- ✅ 正确：
data-user-id→tr.dataset.userId - ❌ 无效：
data-userId、data_user_id、data-UserID→ 全部被忽略，DOM 中根本不存在该属性 - 数字开头如
data-2024-id虽合法，但必须用tr.dataset["2024Id"]，tr.dataset.2024Id是语法错误 - 如果用了模板引擎（如 Vue/React），确认它没把
data-属性当成 prop 过滤掉——某些 SSR 框架默认 strip 非标准属性
动态更新表格行 data 属性的唯一可靠方式
别用 tr.dataset.status = "loading"，这行代码执行后，tr.getAttribute("data-status") 仍返回旧值，表格排序、导出或 CSS 选择器也看不到变化。
立即学习“前端免费学习笔记（深入）”；
- 真正写入 DOM：用
tr.setAttribute("data-status", "loading") - 批量更新多字段：
Object.entries({ status: "done", updated: "2026-07-08" }).forEach(([k, v]) => tr.setAttribute(`data-${k}`, v)) - 删除某个字段：
tr.removeAttribute("data-temp-flag")，不是delete tr.dataset.tempFlag - 特别注意：表格重渲染（如 Vue
v-for重新 diff）会丢掉手动 setAttribute 的值，必须在 render 后再设一次，或改用响应式数据驱动
读取 data 值时类型转换踩坑点
表格常要处理数字排序、布尔状态标记、JSON 配置，但 dataset 返回的永远是字符串，直接参与计算或判断必出错。
-
data-row-index="5"→Number(tr.dataset.rowIndex) + 1，不是tr.dataset.rowIndex + 1（结果是"51"） -
data-is-pinned="false"→ 判断用tr.dataset.isPinned === "true"，不是Boolean(tr.dataset.isPinned)（"false"转布尔为true） -
data-meta='{"price":99.9,"tags":["vip"]}'→ 解析必须用JSON.parse(tr.getAttribute("data-meta") || "{}")，不能用JSON.parse(tr.dataset.meta)（驼峰转换可能破坏原始键名，比如data-user-preferences→dataset.userPreferences）
表格里用 data- 不是不行，而是它只适合挂轻量元数据——比如行 ID、API 路径、初始状态标识；一旦涉及频繁变更、跨组件共享或复杂嵌套，就得让位给专门的状态管理，否则很快会陷入“为什么刚 set 的值读不出来”的循环调试。
