HTML5中type="password"语义不变但安全策略升级：autocomplete需明确设为new-password或current-password，inputmode="text"防数字键盘，禁用type切换改用视觉遮罩，pattern/minlength成基础校验手段，iOS光标重置属系统限制不可绕过。
type="password" 本身没新增 type，但配套属性和行为升级了
HTML5 标准中 type="password" 的语义没变，但现代浏览器（Chrome 86+、Edge 90+、Safari 16.4+）对它的处理逻辑明显收紧——不是功能“加法”，而是安全策略“加码”。最直接的表现是：不显式声明 autocomplete，浏览器也可能强行触发密码管理器弹窗，甚至覆盖你 JS 的 type 切换逻辑。
-
autocomplete="new-password"已成事实标准，比off更可靠，明确告诉浏览器“这是注册/重置场景，别填旧密码” -
autocomplete="current-password"仅用于登录页的“原密码”字段，用错会导致 autofill 失效或建议错乱 -
inputmode="text"在 iOS/Android 上变得关键——否则软键盘默认弹出数字板，用户输不了大小写字母 - 部分安卓机需叠加
autocapitalize="off" autocorrect="off"，否则首字母自动大写会干扰密码规则校验
密码明文切换不再推荐直接改 type，而是用 toggle 模式
早期用 JS 动态把 input.type 从 "password" 改成 "text" 很常见，但现在有兼容性风险：Safari 17+ 和某些 Chrome 版本在 type 切换后可能丢失焦点、清空光标位置，甚至触发 autofill 重载。更稳妥的做法是视觉层模拟——保持 type="password" 不变，用 CSS + JS 控制遮罩或字体渲染。
- 外层容器加
data-visible="true/false"，CSS 里用[data-visible="true"] input选择器做样式微调（比如降低字符间距、换等宽字体） - 避免用
visibility: hidden或opacity: 0遮盖文字——这会让屏幕阅读器误读，也违反可访问性（WCAG） - 按钮图标必须用 SVG 或
pattern 和 minlength 不再只是“锦上添花”，而是基础提示手段
虽然它们仍不能替代后端校验，但新版浏览器对 pattern 的反馈更及时：输入过程中就高亮不匹配项，提交时自动聚焦并显示 title 提示。不过要注意正则限制——HTML5 的 pattern 不支持标志（如 /i），大小写必须写成 [A-Za-z]。
- 强推写法：
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[\W_]).{10,}"（10位以上，含数字/小写/大写/符号） -
minlength="10"比 pattern 更轻量，且表单原生支持错误消息定制（:invalid伪类 +::placeholder联动） - 移动端慎用过于复杂的 pattern，部分 Android WebView 会卡顿或跳过校验
真正容易被忽略的：iOS 光标重置与 focus 策略
这不是 bug，是 iOS 系统级安全机制：密码框失去焦点后，再次点击不会自动定位到末尾，而是从开头开始——哪怕你刚输完 12 位密码，点一下想删最后一位，光标却跳回开头。前端无法绕过，只能接受。
立即学习“前端免费学习笔记（深入）”；
- 解决方案只有两个：一是加“全选”按钮（
select()），二是用inputmode="text"+autocapitalize="off"减少误触 - 不要试图用
setSelectionRange()强行修复，iOS Safari 会静默忽略 - 如果项目必须精准控制光标，得考虑放弃原生
input，改用contenteditable+ 自定义输入管理——但代价是失去 autofill、无障碍支持和 form 关联能力
