reversed 属性仅控制有序列表序号的显示方向，不改变 DOM 顺序或渲染流；它与 start 配合决定初始编号，需配合 JavaScript 动态更新内容才能实现真正的倒计时效果。
reversed 属性只控制序号显示，不改变 DOM 顺序
很多人以为给 <ol reversed></ol> 加上这个属性就能让列表“倒着渲染”，结果发现元素还是从上到下排列，只是数字变成了 5、4、3、2、1 —— 这完全正确，reversed 就是干这个的：它只影响 li 的计数逻辑，不影响节点顺序或渲染流。
所以如果你要做一个视觉+语义都“倒计时”的列表（比如任务剩余步骤），得配合其他手段。常见错误是只加 reversed 就以为倒计时逻辑自动生效，其实它对 JavaScript 计时、DOM 更新、可访问性（如屏幕阅读器读序）都没有额外作用。
-
reversed是布尔属性，写上即启用，无需赋值（reversed="true"是冗余写法） - 起始值仍由
start属性决定；没设start时，默认从列表项总数开始倒数 - 若动态增删
li，浏览器会自动重算序号，但不会触发reversed重新生效逻辑 —— 它只在初始渲染或 DOM 重排时参与计算
倒计时列表必须手动管理 li 的内容或顺序
真要实现“每秒减一”的倒计时效果，不能依赖 reversed 自动更新。它不响应 JS 修改 textContent 或插入新节点，也不绑定数据。
典型做法是：用 JS 控制 li 的文本内容，或者用 flex-direction: column-reverse 配合正常正向 ol 实现视觉倒序（但此时语义仍是正向，对无障碍不友好）。
立即学习“前端免费学习笔记（深入）”；
- 推荐方案：保留
<ol reversed></ol>，用 JS 每次更新所有li的textContent，例如li[0].textContent = "3"; li[1].textContent = "2"; - 避免用
innerHTML重写整个ol，否则会丢失焦点、中断动画、触发不必要的重排 - 如果倒计时项是动态生成的（如 API 返回剩余 7 步），记得同步设置
start，比如<ol reversed start="7"></ol>，否则默认从当前li数量开始倒
reversed + start 组合决定初始编号起点
光有 reversed 不够，尤其当列表项数量变化或初始值不是“从最大数开始”时，start 才是关键参数。浏览器按以下规则算第一个 li 的序号：
若设了 start="N" 且有 reversed，则首项显示 N，后续依次减 1；没设 start 时，首项显示为 li 总数。
- 想让三步倒计时显示为
3. 准备→2. 执行→1. 完成，就写<ol reversed start="3"></ol> - 如果后续 JS 删除了一个
li，剩下两个，浏览器不会自动把start改成 2 —— 它固定不变，除非你手动改ol.start - 注意：CSS 的
counter-reset和counter-increment无法替代reversed，因为它们不支持原生倒序计数，且不被所有屏幕阅读器识别
无障碍与语义一致性容易被忽略
用 reversed 的最大价值其实是语义表达：告诉辅助技术“这是一个递减序列”。但前提是结构真实反映逻辑 —— 如果你用 CSS 翻转了视觉顺序，却没改 HTML 序列，屏幕阅读器仍会按 DOM 顺序读“1. 完成，2. 执行，3. 准备”，这就和视觉矛盾了。
- 真正需要无障碍支持的倒计时列表，应优先用
<ol reversed start="X"></ol>+ JS 动态更新文本，而非仅靠样式反转 - 不要在
li内嵌套另一个ol并加reversed，嵌套倒序行为未被所有浏览器一致实现，且可访问性支持差 - Chrome 和 Firefox 对
reversed的支持很稳定，但 Safari 在旧版本中曾忽略start与reversed的组合，建议测试目标环境
reversed 不是倒计时的开关，它只是序号显示器的“方向拨杆”——拨对了，数字才倒着走；但走多快、停在哪、要不要刷新，全得你用 JS 推一把。
