HTML5 input type在旧浏览器中自动降级为text，type属性值不变但渲染和交互等同于text；检测支持需用行为检测如showPicker或临时元素法，而非读取type属性。
浏览器不支持时 type 会自动降级为 text
HTML5 新增的 type 值（如 email、date、number、url 等）在老浏览器中不会报错，也不会被忽略——而是统一 fallback 到 text。这是 HTML 规范明确要求的行为，所以你不需要手动检测“是否支持”，只要写了，现代浏览器用新控件，旧浏览器就当普通文本框用。
但要注意：降级只发生在解析阶段，input 元素的 type 属性值本身不会变。比如你在 IE11 中写 ，DOM 中 input.type 读出来仍是 "date"，但实际渲染和交互完全等同于 text。
用 input.type 读取值不能判断是否真实支持
直接读取 input.type 属性永远返回你写的字符串，哪怕浏览器根本不认识这个类型。真正要确认“是否启用原生控件”，得靠行为检测：
- 对
date/time/month：检查input.showPicker是否存在且为函数（Chrome 99+、Edge 99+ 支持，Firefox 尚未实现） - 对
number：设置input.value = "abc"后读input.valueAsNumber，若为NaN且input.validity.badInput为true，说明有基础校验逻辑（多数现代浏览器都支持） - 更通用的办法是创建临时元素：
const input = document.createElement('input'); input.type = 'date'; // 如果浏览器不认识，.type 会被设为 'text' const isDateSupported = input.type === 'date';
Modernizr.inputtypes.date 这类检测已基本过时
Modernizr 2.x 的 inputtypes 检测靠的就是上面那个临时元素法，原理没问题，但问题在于：它只测“能否设置该 type”，不测“是否有可用 UI”或“是否触发校验”。比如 Safari 在 iOS 14.5 之前支持 type="date" 但不显示日期选择器，只做字符串输入 + 基础 pattern 校验——Modernizr 会返回 true，但用户得不到预期体验。
立即学习“前端免费学习笔记（深入）”；
现在更务实的做法是按需渐进增强：
- 用
type="date"写基础结构 - 用
if ('showPicker' in HTMLInputElement.prototype)判断能否主动唤起选择器（用于按钮点击触发） - 用
input.addEventListener('input', () => { ... })+input.checkValidity()做实时反馈，别依赖 type 自带的提示样式
移动端键盘自动匹配靠的是 type，不是 pattern 或 inputmode
iOS 和 Android 原生浏览器会根据 type 值自动调出对应键盘（email → 邮箱键盘，tel → 数字键盘，url → 带 .com 快捷键的键盘）。这点非常稳定，连 IE Mobile 都支持。
但注意两个常见陷阱：
-
type="number"在 iOS 上会唤出数字键盘，但用户仍可粘贴字母，且valueAsNumber对非数字返回NaN—— 不能当作强校验依据 -
inputmode是补充属性（如inputmode="decimal"），仅在type="text"时生效；如果同时写了type="number"和inputmode="text"，以type为准 -
pattern不影响键盘类型，只影响提交前的正则校验（且不触发实时反馈）
真实项目里，type 值选错比不支持更麻烦：写成 type="text" 却想靠 JS 模拟日期选择器，不如直接用 type="date" 让系统处理一部分。
