min/max 仅参与提交校验而非实时拦截，设 min="10" 仍可输入 5；需结合 input 事件监听、parsefloat 解析、动态取 min/max 值并修正 value，再辅以后端校验才能真正卡死范围。
min 和 max 属性本身不拦截输入，只参与浏览器原生校验——提交时或调用 checkValidity() 才触发，不能当“输入防火墙”用。
为什么设了 min="10" 还能输 5？
浏览器默认允许键盘任意输入（包括粘贴、删除后重输），min/max 仅影响：上下箭头行为、部分键盘按键禁用（如 min="0" 时禁用减号）、提交时的 validity.rangeUnderflow 状态。用户输完直接点提交，不会中途拦停。
- 空值、非数字（如
"abc"）不触发范围校验，除非加了required -
value初始值超出范围（如<input value="200" min="0" max="100">）会导致控制台报错"The specified value does not conform to the required format" - 未设
step时，step="any"是隐式行为，允许任意小数位——此时max="10"也能输10.999，直到提交才标红
input 事件里怎么实时卡死越界值？
监听 input 事件，用 parseFloat() 解析再比对，避免字符串比较出错（"10" 为 true）；别用 <code>valueAsNumber ——清空输入时它返回 NaN，且部分安卓浏览器支持不佳。
- 先判断
isNaN(parseFloat(el.value))，处理空值或非法字符 - 取
parseFloat(el.min)和parseFloat(el.max)，而非硬编码数字——方便复用组件 - 赋值用
el.value = String(clampedValue)，不要用el.valueAsNumber = ...，否则光标跳尾、iOS 键盘失焦异常 - 若需按
step对齐（如min="1" step="2"，合法值是 1、3、5…），得额外计算最近步长倍数，不能只截断
type="date" 的 min/max 为什么失效？
日期类属性只认严格 "YYYY-MM-DD" 字符串，任何偏差都会静默失效——比如 "2024-3-1"（缺补零）、"2024/03/01"（斜杠）、new Date().toISOString().slice(0,10)（UTC 时区导致东八区偏差一天）。
- 动态生成必须补零：
`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}` - Safari 目前仍不灰显超限日期，仅提交时校验；Chrome/Firefox 可禁用日历选项，但用户仍能手动输入字符串绕过
-
min/max对type="text"完全无效，写了也白写
真正卡死范围，靠的是三道防线：HTML 的 min/max + JS 的 input 实时修正 + 后端强制校验。漏掉任何一层，都可能让 999 或 -1000 进数据库。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
