novalidate 是仅作用于 form 标签的布尔属性，存在即禁用全部原生验证；formnovalidate 为提交按钮提供单次豁免，但 Safari 兼容性差；禁用后 :valid/:invalid 失效，且不替代后端校验。
novalidate 属性不是“开关式”配置，而是存在即生效的布尔标记——只要 form 标签上有它，整个表单的原生验证（required、type="email"、pattern 等）就彻底失效，连提交拦截都跳过。
novalidate 只能加在 form 标签上才有效
它对 input、button 或其他元素加了也没用。常见错误是写成：
<input type="text" required novalidate>
这完全无效。正确写法只有这一种：
<form novalidate>...</form>
-
novalidate是布尔属性，不接受值：novalidate="false"或novalidate="0"都会被浏览器当成 true 处理 - React/Vue 等框架中注意透传：React 要写
noValidate（驼峰），但最终渲染到 DOM 必须是小写novalidate - 如果表单里混用了 JS 验证（比如调用
reportValidity()），没加novalidate会导致点击失焦或手动触发时突然弹原生提示，打断流程
formnovalidate 是提交按钮的“单次豁免”机制
它只作用于带 type="submit" 的按钮，且优先级高于 form 上的 novalidate ——也就是说，即使 form 没加 novalidate，某个按钮加了 formnovalidate，点它就能绕过验证直接提交。
立即学习“前端免费学习笔记（深入）”；
- 仅支持
<input type="submit">和<button type="submit"></button>，<button type="button"></button>加了也无效 - Safari 不支持该属性（截至 iOS 15.4+ 仍存在兼容问题），别依赖它做关键路径逻辑
- 典型场景：一个“保存草稿”按钮加
formnovalidate，一个“正式提交”按钮保持原生校验
禁用后 :valid/:invalid 伪类会失效
加了 novalidate 后，浏览器不再跟踪字段有效性状态，所以 CSS 中的 input:invalid 不再触发，红边框、box-shadow 等默认反馈全部消失。
- 若你用 JS 做校验但想保留视觉反馈，得自己用 class 控制样式，比如
input.is-error - 不要指望
input:invalid { outline: none; }还能起作用——它根本不会匹配 - 如果只是想隐藏原生提示但保留状态计算，可以不加
novalidate，改用event.preventDefault()+checkValidity()手动接管
禁用原生验证 ≠ 可以跳过后端校验
前端禁用验证只是移除了用户侧的拦截和提示，对服务器毫无影响。curl、Postman、禁用 JS 或直接编辑 HTML 都能绕过所有前端逻辑。
-
required、pattern等属性即使被novalidate忽略，仍保留在 DOM 中——辅助技术（如读屏器）可能误读为“必填”，语义污染风险需留意 - 真正想局部关闭某字段校验，删掉它的
required、minlength等属性，而不是留着又靠novalidate压制 - 最常被忽略的一点：
novalidate不影响checkValidity()、validity对象或setCustomValidity()的行为——它们依然可查可用，只是浏览器不自动调用
