step 属性仅在 type="number" 或 type="range" 时生效，type="number" 下仅表单提交触发 stepmismatch 校验，type="range" 中 step 控制松手时的停靠点；step="any" 跳过步进校验但保留基础类型检查；浮点误差需通过单位换算或固定小数位规避。
step 属性不是“设了就自动生效”的开关，它只在特定 type 下起作用，且行为因元素类型和浏览器实现差异极大。不显式声明 type="number" 或 type="range"，step 就是无效的装饰。
type="number" 的 step 校验逻辑怎么触发
只有表单提交时才会触发 stepMismatch 校验，日常输入、粘贴、JS 赋值都不会被拦截。用户手动输入 1.25 并不会实时报错，但点击 submit 时会卡住并提示 Please enter a valid value. The two nearest valid values are 1 and 2.。
- 必须同时有
type="number"和step，否则校验不启动 -
min未设置时，基准默认为0，合法值是0 + n × step的集合 - 若设置了
min="1"，合法值从1开始算，不是从0开始再过滤 - 初始
value="1.05"配step="0.1"会导致 Chrome 静默修正为"1.0"或"1.1"，DOM 看不出变化但交互异常
type="range" 的 step 只控制停靠点，不控制拖动过程
滑块拖动时视觉上可以“滑过任意位置”，但松手瞬间浏览器会强制对齐到最近的 min + n × step 值。这不是 UI 卡顿，而是设计行为。
-
min="0" max="10" step="3"的合法停靠点是0, 3, 6, 9（12超出max，排除） - 移动端 Safari 对
step小于0.1支持极差，部分版本直接降级为step="1" - 滑块本身不渲染刻度线，要可视化步进点需 JS + CSS 手动实现
- 用
input.value读取始终返回字符串，且可能被四舍五入显示（如内部值是"2.2999999999999998"，显示为"2.3"），应改用parseFloat(e.target.value)
step="any" 不是“关闭校验”，而是切换校验模式
step="any" 会让浏览器跳过 stepMismatch 检查，但其他约束（如 required、type="number" 基础格式）依然有效。上下箭头行为也会退化为 ±1 整数增减。
- 用户输入
"3.1415926"不会触发校验失败，但"abc"仍报typeMismatch -
step="any"下调用input.stepUp(1)实际执行的是+1，不是+0.001—— 它不保留当前精度 - 旧版 Safari（≤15.4）会忽略
step="any"，仍按step="1"校验，小数输入可能被清空 - 想支持任意小数又保留箭头微调，更稳妥的做法是：用
step="0.01"+ JS 截断后两位，而非依赖any
浮点精度问题怎么绕开
写 step="0.1" 是最常见也最危险的操作。IEEE 754 浮点表示导致浏览器内部无法精确生成 0.1, 0.2, 0.3... 序列，累加误差会让某些值“不可达”或校验失败。
- 金额类输入一律换算单位：
min="100" step="1" value="199"表示 1.99 元 - 必须用小数时，统一小数位数：
min="0.00" max="10.00" step="0.01"，避免min="0"和step="0.01"混用 - 动态修改
step后，必须重置value：input.setAttribute("step", "0.25")→ 再执行input.value = (Math.round(parseFloat(input.value) / 0.25) * 0.25).toFixed(2) - 不要用
parseFloat(val) + 0.1做增减，优先调用原生input.stepUp(1)，它严格按当前step执行，不引入 JS 浮点误差
真正难的从来不是写对 step 的值，而是处理用户粘贴、第三方输入法、移动端键盘限制、以及浏览器静默修正 value 后留下的状态残留。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
