<input type="time">用于选择本地时区的HH:MM（或HH:MM:SS）时间，不包含日期与时区信息；value、min、max须为合法24小时制字符串，浏览器仅UI约束范围，JS读取为字符串，提交为纯文本，跨时区需手动处理。
time 类型 input 元素的基本用法
HTML 的 <input type="time"> 提供原生时间选择器，支持小时和分钟（可选秒），不包含日期。浏览器会自动渲染为时间选择控件（如滚动滚轮或下拉时间表），但**不校验时区，也不携带时区信息**——值始终以本地时区解析并提交为 HH:MM 或 HH:MM:SS 格式。
基础写法只需指定类型和 name：
<input type="time" name="meeting_time">
注意：value 必须符合 HH:MM 格式（24 小时制，两位小时+两位分钟），例如 "09:30" 合法，"9:30" 或 "09:30 AM" 会被忽略。
设置默认值与限制范围（min/max）
用 value 设初始值，用 min 和 max 控制可选时间范围。这些属性值也必须是 HH:MM 格式，且仅比较时间部分（不考虑日期）。
立即学习“前端免费学习笔记（深入）”；
-
min和max是字符串，不是 Date 对象或毫秒数 - 若
min="08:00"且value="07:00"，输入框会显示空值（因初始值超出范围） - 用户仍可通过手动输入绕过 min/max 限制（浏览器只做 UI 约束，不阻止键盘输入非法值）
示例：
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
<input type="time" name="shift_start" min="06:00" max="14:00" value="09:00">
获取与提交时间值的注意事项
JavaScript 读取 input.value 得到的是字符串（如 "14:45"），不是 Date 实例。想转成时间戳或参与计算，需手动解析：
const timeStr = document.querySelector('input[type="time"]').value;<br>if (timeStr) {<br> const [hours, minutes] = timeStr.split(':').map(Number);<br> const date = new Date();<br> date.setHours(hours, minutes, 0, 0); // 注意：这会修改当天日期，且受本地时区影响<br>}
表单提交时，该字段按原样作为 URL 参数或 FormData 键值对发送，后端收到的是纯字符串，**没有隐含时区含义**。如果业务需要 UTC 时间或带时区处理，必须前端显式转换（比如用 date.toISOString() 截取时间部分再拼接）或后端约定解释规则。
兼容性与常见失效场景
Safari 在 iOS 15.4 之前不支持 step 属性；所有浏览器都不支持 step="1" 表示“精确到秒”——必须写成 step="1"（单位是秒），但实际支持程度参差：Chrome 支持 step="60"（分钟级），Firefox 对 step 基本忽略。
容易被忽略的关键点：
- 安卓 WebView 和部分旧版 UC 浏览器完全不渲染 time 输入框，回退为文本框，且无格式提示
- 用户粘贴非标准格式（如
"2:30pm"）会导致input.value为空字符串，需监听input事件做校验 - 服务端不能假设该字段一定有值——即使设了
required，用户仍可禁用 JS 后清空并提交
真正在意时间精度和跨时区一致性的场景，别只靠 type="time"；要么加 JS 校验和标准化逻辑，要么换用带时区支持的第三方组件。
