reset按钮和form.reset()均无条件恢复表单至HTML初始值，无视JS动态修改；无法跳过字段或保留部分输入；现代框架中易致状态脱节；可控重置须手写JS逻辑。
reset 按钮会无条件清空所有表单控件值
点击 <button type="reset"> 时，浏览器直接把表单恢复到页面加载完成时的初始状态——不是你代码里 set 的值，也不是用户输入中途的“上一次有效值”，而是 value、checked、selected 这些属性在 HTML 中写死的值（或缺省值）。哪怕你用 JavaScript 动态改过 input.value，reset 也完全不认。
- 常见错误现象：
reset后textarea变空，但里面原本有 JS 注入的默认提示文字；select被强制跳回第一个<option>，哪怕你之前用selectedIndex = 2设过 - 使用场景极少：只适合纯静态表单，且你确定所有字段初始值都通过 HTML 属性声明（比如
<input value="默认邮箱">） - 现代框架（React/Vue）中基本失效：因为值由 state 驱动，DOM 层 reset 不触发 re-render，界面和状态立刻脱节
HTML reset 无法跳过某些字段或保留部分输入
没有标准方式让 type="reset" 忽略某个 <input>。它对所有 form 内可重置控件（input、select、textarea、output）一视同仁，连 disabled 或 readonly 的也不放过（只是视觉上没变，实际 DOM 值被清了）。
- 容易踩的坑：给搜索框加
placeholder="搜商品"，以为用户看到提示就安全了——但reset后value变空，placeholder 重新显示，看起来正常，其实已丢失用户可能手动输入过的关键词 - 兼容性没问题，但行为太刚性：Chrome/Firefox/Safari 表现一致，正因如此，才更难妥协
- 替代思路只能是手写 JS 清空逻辑，例如只清
class="resettable"的字段，或调用form.reset()后立刻用 JS 恢复特定字段
form.reset() 和点击 reset 按钮本质相同
form.reset() 方法和点击 <button type="reset"> 触发的行为完全等价，都是还原到 form 的「初始值快照」。这个快照在 DOM 解析完 HTML 时就固定了，后续任何 JS 赋值都不会更新它。
- 参数差异：无参数，不能传配置对象，不能指定字段列表
- 性能影响极小，但副作用明确：会触发所有表单控件的
change和input事件（如果它们当时有值），可能意外激活校验逻辑或埋点上报 - 示例：假设
<input id="name" value="张三">，JS 执行document.getElementById('name').value = '李四'，再调form.reset()→ 输入框内容变回“张三”，不是空，也不是“李四”
真正可控的重置必须用 JavaScript 手动实现
要保留某些字段、跳过动态生成项、或按业务规则清空（比如只清搜索条件，不清分页页码），唯一可靠方式是遍历控件，逐个赋值。别试图 hack reset，它没留钩子。
立即学习“前端免费学习笔记（深入）”；
- 推荐做法：给需要重置的字段加
data-reset="true"，然后写函数遍历并设为空字符串 /null/ 初始值 - 注意
checkbox和radio：要设checked = false，不是value = "" - 隐藏字段（
type="hidden"）常被忽略，但它参与提交，若需保留，必须显式跳过 - 复杂点在于：初始值未必是空——可能是 API 返回的默认配置、localStorage 缓存值、或上一步表单带过来的上下文。这些都得你自己记、自己管
