role="presentation" 仅覆盖有隐式角色且允许被覆盖的元素（如table、ul），对img需配alt=""才有效，div/span加此属性冗余；表格中须移除th/caption等语义子元素，且ARIA不抑制内部按钮等原生角色。
role="presentation" 不会“移除默认语义角色”，它只是**覆盖（override）** 浏览器或辅助技术对元素的默认角色解析——但前提是该元素原本有可被覆盖的隐式角色，且未被其他 ARIA 属性或原生语义干扰。
哪些元素能用 role="presentation" 有效覆盖默认角色
只有那些**本身有隐式 ARIA 角色、且该角色允许被 presentation 覆盖**的元素才真正生效。例如：
-
<table>默认是role="table"→ 可被role="presentation"覆盖 -
<ul>默认是role="list"→ 可被覆盖 -
<img>没有隐式角色（除非有alt）→role="presentation"无实际作用，必须配alt="" -
<div>和<span>本就是role="generic"或无角色 → 加role="presentation"属于冗余
role="presentation" 在表格中失效的典型场景
即使给 <table> 加了 role="presentation"，如果内部还保留 <th> 或 <caption>，辅助技术仍可能恢复语义（比如把 <th> 当作 role="columnheader" 处理）。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 必须同时移除所有语义化子元素：把
<th>改成<div role="none">或<td>，删掉<caption> - 避免嵌套带语义的元素（如
<button>、<a>）在role="presentation"容器内——它们的原生角色不会被外层role抑制 - Chrome + NVDA 下，某些旧版渲染引擎会对
role="presentation"的<table>仍暴露空的表格结构，需配合aria-hidden="true"双保险（仅当确认纯装饰）
比 role="presentation" 更可靠的做法
对纯视觉装饰，优先用 CSS 实现，而非语义 HTML + ARIA 覆盖：
立即学习“前端免费学习笔记（深入）”；
- 用
<div>+background-image替代<img src="deco.png" alt="">，彻底避开语义介入 - 用伪元素
::before/::after绘制分隔线、图标等，不进入 DOM 树语义流 - 若必须用
<img>做装饰，唯一正确写法是：<img src="deco.svg" alt="" role="presentation">——alt=""是硬性前提，role="presentation"在这里只是冗余补丁 - 对图标字体（如 Font Awesome），应包裹在
<span aria-hidden="true">中，并确保旁白文本由相邻<span>或aria-label提供
真正容易被忽略的是：ARIA 角色覆盖只作用于“角色”本身，不影响状态（aria-expanded）、属性（aria-label）或名称计算逻辑。一个被标记为 role="presentation" 的元素，如果还有 aria-label，屏幕阅读器反而会读出这个标签——因为它已不再是“无角色”，而是“被显式赋予 presentation 角色”，而 aria-label 依然参与名称计算。
