登录表单中autocomplete="current-password"必须与autocomplete="username"字段共存于同一form内，且需正确关联label、id、type，否则屏幕阅读器无法识别或密码管理器拒绝填充。
autocomplete 属性本身不直接提升可访问性，但它和 label、type、name 配合得当，才能让屏幕阅读器准确识别字段用途并触发密码管理器——单独乱设反而破坏体验。
autocomplete="current-password" 必须和登录上下文共存
只写 autocomplete="current-password" 不够。浏览器（尤其是 Safari 和 Chrome ≥76）要求它出现在一个有明确登录语义的表单中：必须有 username 或 email 字段，且二者都需正确标注 label 和 id。否则，读屏软件可能读作“密码输入框”，但无法关联到已保存的账户凭据。
-
username字段需配autocomplete="username"（不是"user_name"），type="text"或type="email"，并确保label for="user-id"与input id="user-id"完全一致 - 密码字段若漏掉
label或for/id不匹配，即使autocomplete="current-password"正确，NVDA 仍可能跳过播报 - 不要用
placeholder替代label——它不参与可访问性树，且在焦点进入时消失
autocomplete 值写错等于没写，且不报错
浏览器对 autocomplete 值执行静默忽略：拼写错、大小写错、加下划线或前缀，全当无效值处理，退化为最粗糙的字符串匹配，导致读屏提示不准、密码填错框、地址行错位填充。
-
autocomplete="Email"（首字母大写）→ 被忽略；必须小写"email" -
autocomplete="user_email"→ 无效；标准值只有"email" -
autocomplete="name"→ 可工作但不推荐；Safari 拒绝为该值提供建议，应拆为"given-name"和"family-name" -
autocomplete="street-address"有效；"shipping_address"或"address1"无效
动态渲染中 autocomplete 极易丢失语义
React/Vue 组件内用 useState 或 v-model 控制表单显隐，或 JS 动态插入 input 元素时，autocomplete 属性常在 DOM 初始扫描后才被挂载——浏览器根本不认。
- React 中不能依赖 useEffect 异步设置
autocomplete；必须在 JSX 中直接写出：<input autocomplete="email"> - Vue 中避免
v-if控制 input 显隐；改用v-show保证初始 DOM 存在 - SSR 页面 hydration 后清空
value，若顺手删了autocomplete属性，Chrome 会重新扫描并意外激活填充逻辑 - 所有
input必须包裹在<form></form>标签内；脱离form的独立 input，哪怕属性全对，浏览器也大概率跳过
真正关键的不是 autocomplete 写了没，而是它是否和 label、type、name、form 四者同时在线且完全合规——缺一不可，错一个就断链。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
