input的value属性控制当前值而非默认值，表单重置只恢复初始HTML中的defaultValue；真正默认值由defaultValue体现，需JS初始化；placeholder+JS赋值更灵活安全。
input 的 value 属性不是默认值的“回退机制”
很多人以为给 <input> 设置 value 就是“设默认值”，其实它直接控制的是**当前值**——只要没用 JavaScript 动态改，页面一加载就显示、用户一删就清空，且不会在表单重置时自动恢复（除非你手动监听 reset 事件）。真正的“默认值”行为，得靠 defaultValue 这个只读属性来体现，但它不能直接写在 HTML 里，只能靠 JS 初始化后读取。
HTML 中写死 value 是最常用但有副作用的做法
比如：<input type="text" value="张三">。这确实能让输入框一打开就显示“张三”，但它会带来两个实际问题：
- 如果后续 JS 执行了
input.value = ""或input.value = null，再点表单重置按钮，input不会变回“张三”，而是保持为空（因为defaultValue被初始化为 "张三"，但重置只对初始 DOM 值生效；而这里 DOM 的value属性已被 JS 覆盖） - 服务端渲染或模板引擎（如 Django、Vue SSR）中，若
value值含未转义的双引号或尖括号，容易破坏 HTML 结构，必须做 HTML 实体编码 - React/Vue 等框架里直接写
value会让组件变成受控组件，忘记配onChange就会锁死输入
用 placeholder + JS 初始化更灵活
placeholder 只是提示，不是默认值，但它和 JS 配合能避开很多坑。典型做法是：
- HTML 里只写
<input type="text" placeholder="请输入姓名"> - JS 加载后，根据数据源（如 URL 参数、localStorage、API 返回）决定是否赋值：
input.value = data.name || "" - 如果要支持重置，可提前存一份初始值：
input.dataset.initial = data.name，然后在reset事件里恢复：input.value = input.dataset.initial || ""
这样既避免了 HTML 层硬编码，又保留了用户修改后的状态可被程序感知的能力。
表单 reset() 行为依赖 DOM 初始属性值，不是 JS 当前值
这是最容易被忽略的一点：调用 form.reset() 或点击 <button type="reset"> 时，浏览器只会把每个字段的 value 设为它**最初解析 HTML 时记录的 defaultValue**，而不是你后来用 JS 设置的值。
验证方式很简单：
<input id="test" value="初始"> <button onclick="console.log(test.defaultValue)">查 defaultValue</button> <button onclick="test.value='新值'; console.log(test.value)">改 value 再查</button> <button onclick="test.form.reset(); console.log(test.value)">reset 后查</button>你会发现，无论你中间怎么改
test.value，reset() 总是回到 “初始”。所以如果你需要动态“重置到某次 JS 设置的值”，就得自己实现，不能依赖原生 reset。 
