<input type="time"> 的 value 属性返回 "HH:MM" 格式字符串，非 Date 对象；valueAsDate 和 valueAsNumber 均不可用（分别返回 null 和 NaN）；需手动拼接日期（如当天）才能转为有效 Date。
用 value 属性直接读取 <input type="time"> 的值
HTML 原生时间输入框返回的是标准格式字符串，不是 Date 对象。用户选中后，input 元素的 value 属性会自动更新为 "HH:MM" 格式（24 小时制，带前导零），例如 "14:30" 或 "09:05"。
常见错误是试图用 new Date(input.value) 直接解析——这在部分浏览器里会失败或返回无效日期，因为 "14:30" 不是完整 ISO 时间字符串。
- 监听
change事件获取最终确认值（用户点开、调整、关闭弹窗后触发） - 也可监听
input事件实时响应（但注意：移动端软键盘输入时可能不触发，且用户未确认前值可能不合法） - 务必检查
value是否为空字符串：if (input.value) { ... }，因为用户可清空输入框
valueAsNumber 和 valueAsDate 在 time 类型下不可用
<input type="time"> 不支持 valueAsNumber（始终返回 NaN）和 valueAsDate（始终返回 null）。这是规范明确规定的限制，不是浏览器 bug。
试图调用它们不仅得不到时间戳或 Date 实例，还会掩盖你对值格式的误判。比如：
立即学习“前端免费学习笔记（深入）”；
const input = document.querySelector('input[type="time"]');
console.log(input.valueAsDate); // null
console.log(input.valueAsNumber); // NaN
如果你需要时间戳或 Date 对象，必须手动拼接日期上下文（如当天日期）再解析。
想转成 JavaScript Date 对象？得补全日期部分
纯时间字符串无法独立生成有效 Date，必须绑定某一天。最常用做法是用当前日期（new Date()）的年月日，拼上用户选中的时分：
function timeStringToDate(timeStr) {
if (!timeStr) return null;
const [hours, minutes] = timeStr.split(':').map(Number);
const now = new Date();
const date = new Date(now.getFullYear(), now.getMonth(), now.getDate(), hours, minutes);
return date;
}
注意点：
- 不要用
new Date(timeStr)—— 大多数浏览器会返回 Invalid Date - 如果业务需要跨天（如“23:59 → 00:01”），不能只靠这个函数，得额外处理逻辑
- 服务端接收时，通常更推荐直接传
HH:MM字符串，由后端统一解析，避免客户端时区干扰
移动端兼容性与用户行为差异
iOS Safari 和部分安卓 WebView 对 type="time" 的实现较弱：有的不支持秒（即使写 step="1"），有的点击后弹出滚轮但不触发 change 直到失焦，有的甚至忽略 min/max 属性。
真实场景中建议：
- 用
inputmode="numeric"+ 自定义格式提示辅助软键盘唤起 - 对关键业务（如预约系统），增加校验：提交前检查
value是否匹配/^([01]?[0-9]|2[0-3]):[0-5][0-9]$/ - 别依赖
focus或blur判断用户是否完成选择——移动端生命周期不一致
原生 time 输入框省事，但它的值只是字符串，而且没日期上下文；想安全转成时间对象，补哪天、怎么补，得你自己定规则。
