aria-placeholder 不是标准属性，WAI-ARIA 规范中不存在，浏览器不识别、屏幕阅读器不读取；原生占位符仅靠 placeholder 属性实现，自定义组件需用 aria-label、aria-labelledby 或 aria-describedby 配合手动控制提示文案显隐。
aria-placeholder 不是标准 HTML 属性，浏览器不识别、不渲染、不触发任何行为——它只是个无效字符串。
为什么 aria-placeholder 不存在且不能用
WAI-ARIA 规范里压根没有 aria-placeholder 这个属性。你查不到它的定义、取值或语义，所有声称“支持 aria-placeholder”的文档或工具链，要么是笔误，要么是混淆了 placeholder 和 ARIA 的边界。
- HTML 原生占位符只靠
placeholder属性实现，仅对<input>（部分 type）和<textarea>生效 - ARIA 的作用是补充语义，不是替代原生行为；
aria-label、aria-labelledby或aria-describedby才是正确暴露提示文案的途径 - 给自定义组件（比如
<div contenteditable>或封装的<MyInput>）加aria-placeholder="xxx"，DevTools 里能看到这个属性，但屏幕阅读器不会读，视觉上也不会显示
自定义输入组件中真正可用的占位符方案
想在非原生控件（如 contenteditable、React/Vue 封装输入框、Canvas 输入模拟）里实现类似 placeholder 的效果，必须手动控制 DOM 和 ARIA 状态：
- 用
data-placeholder+ CSS::before或span辅助元素渲染提示文字，配合visibility: hidden/opacity: 0控制显隐 - 输入框为空且未聚焦时，添加
aria-hidden="true"到提示元素；获得焦点后移除，确保屏幕阅读器不重复播报 - 必须配
aria-label或aria-labelledby，把字段用途告诉辅助技术——例如：<label id="name-label">姓名</label><div aria-labelledby="name-label" aria-placeholder="请输入真实姓名">...</div>中的aria-placeholder仍无效，但aria-labelledby是有效的 - 监听
input和blur事件，动态切换提示元素的显示/隐藏状态，别依赖 CSS :empty 伪类（contenteditable里不可靠）
常见错误：把 aria-placeholder 当成“无障碍版 placeholder”
这种理解完全错误。placeholder 本身就不被屏幕阅读器稳定朗读，所以它从来就不是无障碍方案——而是视觉辅助补丁。真正影响可访问性的，是以下三点：
立即学习“前端免费学习笔记（深入）”；
- 每个可编辑区域必须有明确的
role="textbox"（如果是contenteditable）或使用原生<input>/<textarea> - 必须通过
aria-label、aria-labelledby或视觉隐藏的<label>提供唯一、稳定的说明文本 - 提示文案（如“示例：zhangsan2024”）应放在
aria-describedby指向的辅助元素里，而不是塞进某个虚构的aria-placeholder
真正麻烦的是：placeholder 文字一输就消失，而用户可能根本没看清格式要求；aria-placeholder 这种不存在的属性，只会让你误以为问题已解决，结果在 VoiceOver 或 TalkBack 下完全不可用。
