reversed属性仅倒序编号而不改变DOM顺序或视觉位置；需配合start属性实现预期编号，否则可能失效或兼容性差，真正倒序内容须操作数据或DOM。
reversed 属性不能让列表项目“从大到小逆序排列”，它只控制编号递减，不改变 li 的 DOM 顺序或视觉位置——这是最常被误解的一点。
reversed 属性的真实作用：仅倒序编号，不重排内容
给 <ol> 加 reversed，浏览器会尝试让编号从高往低走（如 5、4、3），但 li 元素在 DOM 中仍按原始顺序排列，渲染流和屏幕阅读器读取顺序也完全不变。
- 写
<ol reversed><li>A</li><li>B</li></ol>，显示为 “1. A / 1. B” 或 “1. A / 0. B”（部分浏览器截断负数），**不是** “2. A / 1. B” - 要看到 “5. A / 4. B / 3. C”，必须显式加
start="5"：<ol reversed start="5"> - 若漏掉
start，浏览器按项数隐式设值（如 3 项 →start="3"），但 Safari ≤16.4 会忽略该逻辑，直接当普通<ol>渲染
想让“最后一项显示在最上面”？reversed 完全无效
真正需要内容倒序（比如把数组末尾元素放在列表顶部），reversed 是障眼法，必须操作数据或 DOM：
- 服务端/构建时反转数组再生成 HTML —— 最健壮，语义和可访问性完整
- 前端 JS 反转：用
Array.from(ol.children).reverse()后逐个prepend()，避免用innerHTML丢失事件绑定 - CSS
flex-direction: column-reverse能翻转视觉顺序，但会同步反转键盘 Tab 流和屏幕阅读器顺序 —— 若需可访问性，得配aria-reversed="true"并测试
reversed + start 组合的典型陷阱
这个组合看似简单，实则极易出错：
立即学习“前端免费学习笔记（深入）”；
-
value属性会破坏reversed行为：<li value="10">后的编号不再递减，而是从 10 开始继续递增 - 动态增删
li后，start不会自动更新 —— 新增项可能显示为 “5. … 6.”，需手动调ol.setAttribute('start', newTotal) - 与 CSS
counter-reset冲突：一旦用了自定义计数器，reversed完全失效 - 在 IE 全系和旧版 Safari 中，
reversed被完全忽略，降级后显示为默认 1. 2. 3.
更可控的替代方案：CSS counters
当需要稳定倒序编号、兼容老浏览器、或配合动态数据时，放弃 reversed，改用 CSS 计数器：
- 固定项数场景：
ol { counter-reset: item 5; }+li::before { content: counter(item) ". "; counter-increment: item -1; } - 动态项数场景：JS 计算总项数后注入
style或 class，例如ol.style.setProperty('--total', items.length)，再用counter-reset: item var(--total) - 支持字母/罗马数字倒序（如 z y x），而
reversed对type="a"的行为不可靠
最容易被忽略的是：编号是否承载语义。如果它是步骤顺序、错误优先级或法律条文序号，编号必须与数据逻辑严格对齐——光靠 reversed 改数字，反而制造歧义。
