value是动态当前值，defaultvalue是html初始值的静态快照；reset()恢复defaultvalue而非js设置的value；react受控组件用value+onchange，非受控才用defaultvalue。
value 是当前值，defaultValue 是 HTML 初始值
DOM 元素的 value 属性反映的是用户当前看到并可能已修改的内容，是动态的；而 defaultValue 是元素挂载时从 HTML value attribute（即标签里写的 value="xxx"）读取的静态快照，只在初始化那一刻生效。
常见错误是把两者当一回事：比如用 el.setAttribute('value', '新值') 试图“重置”输入框，结果 form.reset() 仍恢复成旧值——因为 setAttribute 只改了 HTML attribute，没动 defaultValue，也没同步更新 value property。
-
el.value可读可写，修改后立即影响表单提交值和 UI 显示（触发input/change事件） -
el.defaultValue只读，JS 无法赋值；它只由 HTML 中的valueattribute 决定，哪怕你后续删掉该 attribute，defaultValue也不会变 - 验证方式：
el.getAttribute('value')返回原始 HTML 值（和defaultValue一致），el.value返回当前真实值
reset() 恢复的是 defaultValue，不是你 JS 设置过的 value
点击 <input type="reset"> 或调用 form.reset()，所有控件会回退到其 defaultValue 状态，而不是你用 JS 赋过的 value。这是最常翻车的点。
典型场景：<input value="张三"> → 用户输入“李四” → JS 执行 el.value = "王五" → 点 reset → 输入框清空（不是变回“张三”，更不是“王五”）。
- 原因：JS 设置
el.value = "王五"并未改变defaultValue，而reset()只认defaultValue - textarea 不支持
valueattribute，所以它的defaultValue来自标签内文本：<textarea>初始内容</textarea> - checkbox/radio 必须用
defaultChecked，不是defaultValue；select 要靠<option selected></option>，否则reset()失效
React/Vue 中 value 和 defaultValue 别混着用
框架层对表单的控制逻辑会覆盖原生行为。比如 React 的受控组件要求显式绑定 value + onChange，此时写死的 defaultValue 完全无效；而 Vue 的 v-model 会接管 value，但若你同时写了 value="xxx"，它可能被忽略或引发警告。
- React 受控组件：初始值靠
useState("xxx")，不要写defaultValue - React 非受控组件：可用
defaultValue="xxx"，但之后 props 更新不会同步到输入框 - Vue：用
v-model绑定响应式变量即可，value和defaultValue都不该手动设（除非特殊场景如 SSR 首屏渲染） - 混合使用（比如先用
defaultValue，再切到受控）极易导致 warning 或值丢失
什么时候该用 value，什么时候该用 defaultValue
核心判断标准：你是否需要“用户修改后还能一键回到最初状态”。如果需要，就靠 defaultValue（配合 reset()）；如果只是预填、且后续不打算 reset，直接用 JS 设置 value 更灵活。
- 服务端渲染编辑页：用 HTML
valueattribute → 自动成为defaultValue→ 用户改完可点 reset 回退 - 客户端动态填充（如 URL 参数）：用 JS 赋值
el.value = param，别碰defaultValue - 表单校验失败后恢复初始值：别依赖
reset()，而是缓存原始值（如const initValue = el.value），出错时手动el.value = initValue - 注意：移动端某些浏览器对
defaultValue的读取有延迟，首次聚焦时可能闪一下；若敏感，优先用 JS 初始化 + 自定义重置逻辑
defaultValue 在元素创建后就固定了，哪怕你后来用 setAttribute 改了 HTML 的 value，它也不会更新。真正可靠的初始化方式，永远是“HTML 写对 + JS 少干预”。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
