input的min/max仅对type="number"或"type=range"有效；type="text"时被忽略；DOM返回字符串需parseFloat转换；原生校验不拦截非法输入，需手动业务校验；服务端必须独立验证。
input 的 min 和 max 属性只对数值型输入有效
浏览器不会自动把任意 input 当作数字来校验——必须明确指定 type="number" 或 type="range"，min/max 才会被识别为数值边界。如果用 type="text"，即使写了 min="1"，浏览器也完全忽略，既不验证也不限制输入。
-
type="number"：支持键盘数字输入、上下箭头微调，原生校验触发（提交时提示“值必须不低于 X”） -
type="range"：仅滑块控件，min/max决定滑动范围，值始终是数字 -
type="text"或未设type：属性存在但无行为，JS 读取element.min会返回字符串"1"，但不参与任何约束
JavaScript 读取 min/max 时注意类型转换
DOM 属性返回的是字符串，不是数字。直接比较或计算会出错，比如 input.max > 100 在 max="50" 时结果是 true（字符串比较："50" > "100" → 字典序成立）。
- 用
parseFloat(input.min)或Number(input.min)转为数字，推荐前者（能处理"1.5"等浮点） -
input.min === ""表示未设置，此时应视为无下限；同理input.max === ""表示无上限 - 若需兼容空值逻辑，建议封装工具函数：
function getMinValue(el) { return el.min === "" ? -Infinity : parseFloat(el.min); } function getMaxValue(el) { return el.max === "" ? Infinity : parseFloat(el.max); }
表单提交前校验要手动补全原生缺失的场景
原生 min/max 校验只在表单提交（submit）或调用 checkValidity() 时触发，且对非数字输入（如用户粘贴了字母）不报错——它只检查“当前值是否为有效数字且落在范围内”。这意味着：
- 用户输入
"abc"，input.valueAsNumber是NaN，但checkValidity()仍返回true（因为type="number"允许空值或非法输入，不强制格式） - 需要业务级校验时，得自己判断：
const num = parseFloat(input.value); if (isNaN(num)) { alert("请输入有效数字"); } else if (num < getMinValue(input) || num > getMaxValue(input)) { alert(`请输入 ${getMinValue(input)} 到 ${getMaxValue(input)} 之间的数字`); } - 别依赖
input.validity.rangeUnderflow或rangeOverflow，它们只在值是合法数字但越界时为true
服务器端不能信任前端 min/max 限制
这些属性纯属客户端提示和轻量校验，可被绕过：禁用 JS、修改 DOM、用 curl 提交任意值。后端收到数据后必须独立解析并验证数值范围。
立即学习“前端免费学习笔记（深入）”；
- 例如 Python Flask 中：
try: value = float(request.form.get("age", "")) if not (0 <= value <= 150): abort(400, "age must be between 0 and 150") except (ValueError, TypeError): abort(400, "age must be a number") - 数据库字段也应加 CHECK 约束（如 PostgreSQL：
CHECK (age BETWEEN 0 AND 150)），不能只靠 HTML 层 - 尤其注意浮点精度问题：HTML
min="0.1"在 JS 中可能变成0.10000000000000002，后端解析时建议用 Decimal 或合理 tolerance 处理
type 缺失导致属性失效，以及把字符串当数字直接比较。这两处一错，整个范围控制就形同虚设。 
