自定义元素中step属性无反应，因浏览器不自动实现步进逻辑；需手动解析step值、重写stepUp/stepDown、提供valueAsNumber访问器并校验stepMismatch。
原生 step 属性无法直接“继承”到自定义元素（如 class extends HTMLElement）中，因为浏览器不为自定义标签自动实现 type="number" 或 type="range" 的内置步进逻辑。你必须手动桥接语义、行为与校验。
为什么自定义元素里写 step 没反应
自定义元素默认没有 valueAsNumber、stepUp()、stepDown() 等 API，也不参与表单验证（validity.stepMismatch 为 undefined）。即使你在 HTML 中写 <my-input step="0.5"></my-input>，该属性只是个普通字符串，浏览器不会触发任何步进对齐或校验。
常见错误是以为加了 step 属性就能让自定义输入框支持上下箭头跳变——实际连事件监听都得自己配。
如何手动实现等效的 step 行为
核心是把 step 属性值解析为数字，并在用户交互时强制对齐到合法序列：min + n × step。需覆盖以下入口：
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
立即学习“前端免费学习笔记（深入）”；
- 监听
input事件：对parseFloat(this.value)做四舍五入规整，例如Math.round(val / step) * step - 重写
stepUp(n = 1)和stepDown(n = 1)方法：调用时读取当前valueAsNumber，按步长累加/减，再写回value - 暴露
valueAsNumbergetter/setter：避免每次都要parseFloat()，同时处理NaN和空值 - 手动触发
checkValidity()：在setCustomValidity()中根据是否满足(val - min) % step === 0判断（注意浮点误差，建议用Math.abs((val - min) % step) ）
step="any" 在自定义元素中怎么模拟
原生 step="any" 的语义是“跳过 stepMismatch 校验”，但在自定义元素中你本就不走原生校验，所以重点是行为退化：上下箭头应允许任意小数增减（比如从 1.23 → 1.24），而非强制对齐到整数倍。此时：
- 不要做
Math.round()规整 -
stepUp(1)应执行val + parseFloat(this.step || "1")，但若this.step === "any"，则固定加1（即退化为整数步进，符合规范） - 仍需配合
min/max边界检查，step="any"不解除范围限制
容易被忽略的兼容细节
最常漏掉的是初始值校验：如果自定义元素初始化时 value 不满足 min + n × step，后续所有 stepUp() 都会从一个非法起点开始偏移。务必在 connectedCallback 中检查并静默修正一次。另外，移动端软键盘弹出时，部分 Android WebView 会忽略 input 事件而只触发 change，所以关键规整逻辑最好同时挂载在两个事件上，且用 requestAnimationFrame 节流防抖。
