aria-describedby 指向的元素必须存在、可访问且已渲染，ID 须空格分隔多个提示，配合 aria-live 实现动态更新朗读；它仅补充说明，不可替代 label 或 aria-label。

aria-describedby 指向的元素必须存在且可访问

如果 aria-describedby 的值（如 id）指向一个不存在的元素，屏幕阅读器会静默忽略，不会报错，但提示完全失效——这是最常被忽略的“无感失败”。

• 确保目标元素已渲染且具有匹配的 id，不能依赖 JS 异步插入后才补上 id
• 目标元素不需要 aria-hidden="true"，否则会被跳过；也不应设 display: none 或 visibility: hidden，否则多数读屏器不读取
• 推荐用 role="tooltip" 或 role="alert" 明确语义，尤其当提示是动态出现时

多个提示 ID 用空格分隔，不是逗号

aria-describedby 支持绑定多个元素，但分隔符必须是空格，写成逗号或分号会导致只识别第一个 ID。

<input aria-describedby="hint1 hint2">
<div id="hint1">必填字段</div>
<div id="hint2">请输入邮箱格式</div>

• 空格分隔 → 屏幕阅读器按顺序朗读两个提示
• aria-describedby="hint1,hint2" → 只读 hint1，hint2 被当作无效 ID 忽略
• ID 顺序影响朗读顺序，把更关键的提示放在前面

表单控件 + aria-describedby 不替代 <label></label>

aria-describedby 是补充说明，不是标签替代方案。没有 <label></label> 或 aria-label 的控件，即使有 aria-describedby，仍会被读作“编辑框”“复选框”等无上下文名称，用户不知道它是什么。

Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转

实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。

下载

• 必配 <label for="xxx"></label> 或 aria-label 提供控件名称
• aria-describedby 适合放格式要求、错误示例、额外约束（如“密码需含大小写字母和数字”）
• 避免在 <label></label> 里塞大量说明文字——可读性差，且焦点进入时重复朗读

动态更新描述内容要触发读屏器重读

如果提示内容随交互变化（如校验失败后显示错误信息），仅修改目标元素文本不会自动朗读，需主动通知。

立即学习“前端免费学习笔记（深入）”；

• 给目标元素加 aria-live="polite"（推荐），读屏器会在空闲时朗读更新
• 紧急提示（如提交失败）可用 aria-live="assertive"，但慎用，会打断当前语音
• 不要用 aria-hidden 切换显隐——隐藏时内容不可访问，显示时又没触发重读

实际中最容易漏的是目标元素的 id 存在性检查和 aria-live 的配合。很多“写了却没读出来”的问题，根源不在绑定语法，而在 DOM 状态与可访问性生命周期没对齐。