typeMismatch 是 ValidityState 对象中标识输入值类型不匹配的布尔属性，当 type="email" 缺 @ 或域名结构、type="url" 缺协议时为 true，仅作基础语法判断，不验证真实性或可访问性。
直接读取 input.validity.typeMismatch 就能判断邮箱或网址格式是否出错——它在用户输入明显不符合 type="email" 或 type="url" 要求时自动为 true，比如输入 user@、example.com（缺协议）或空格开头等。
typeMismatch 是什么
它是 ValidityState 对象中的一个布尔属性，专门用于标识「输入值类型不匹配」。当 input 设置了 type="email" 却没含 @ 和域名结构，或设了 type="url" 却没以 http:// 或 https:// 开头时，该属性就会返回 true。
- 注意：它不校验邮箱是否真实存在，也不检查 URL 是否可访问，只做基础语法判断
-
type="email"允许user@localhost这类本地域，仍算typeMismatch === false -
type="url"会拒绝example.com，但接受https://example.com/path?x=1
怎么准确读取和响应
别依赖 input.checkValidity() 或 submit 事件才查——应在用户失焦（blur）或实时（input）时主动检查，结合 validity.typeMismatch 做反馈：
- 用
input.addEventListener('blur', () => { if (input.validity.typeMismatch) { /* 提示格式错误 */ } }) - 避免仅靠
!input.validity.valid判断，因为可能由valueMissing或patternMismatch引起 - 显示提示前，建议先确认
input.validity.valid === false且input.validity.typeMismatch === true，排除其他错误干扰
配合 pattern 做更细粒度控制
原生 typeMismatch 规则较宽松，如需限制邮箱用户名不能含连续点号、URL 必须是 HTTPS 等，可加 pattern 属性：
<input type="email" pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}">- 此时若格式不符，触发的是
patternMismatch，而非typeMismatch；两者互斥，不会同时为true - 用
setCustomValidity()可覆盖默认提示文案，让错误信息更明确
服务端仍需独立验证
typeMismatch 是前端友好提示，不是安全防线：
- 用户可禁用 JS、绕过表单提交、用工具直接发请求
- 浏览器兼容性有限：IE9 及以下完全不支持
type="email"和validityAPI - 后端必须用可靠正则或专用库（如
validator.js）重新校验，且要查 MX 记录、防临时邮箱等业务规则
