value属性在button中仅当type为submit或reset时生效，用于表单提交时携带特定字段值而非控制显示文字；按钮文本由标签内内容决定，未设value时默认提交innerText，disabled状态下value被忽略。
value属性在
它只对 <button type="submit"> 或 <button type="reset"> 有效，且仅在表单提交时作为该按钮的字段值发送——不是按钮上显示的文字，也不是点击后触发的逻辑。很多人误以为设了 value 就能控制按钮文案，结果发现文字没变，是因为按钮的可见文本由标签内内容决定（比如 <button value="save">保存</button> 中“保存”才是显示内容）。
什么时候必须用value，什么时候可以省略
只有当按钮是提交控件、且你希望它在表单提交时携带一个特定值（而非按钮文本）时才需要 value。常见场景：
• 同一页面多个提交按钮（如“保存草稿”“发布文章”），后端靠 value 区分操作意图；
• 按钮文本是中文或带空格，但后端接口要求固定英文标识（如 value="publish"）；
• 使用 type="image" 的按钮（已淘汰，不推荐）。
如果按钮只是执行 JavaScript（type="button"），value 完全无用，删掉更干净。
和input[type="submit"]的value行为一致吗
基本一致，但有关键差异：
• <input type="submit" value="提交"> 的 value 同时决定显示文本和提交值；
• <button type="submit" value="submit">点我上传</button> 的 value 只影响提交值，“点我上传”才是显示内容；
• 如果 <button> 没写 value，提交时默认用按钮文本（即 innerText）作为字段值，可能含空格或换行，后端解析易出错；
• 浏览器兼容性没问题，所有现代浏览器都按规范处理。
立即学习“前端免费学习笔记（深入）”；
容易被忽略的坑：disabled状态下的value还生效吗
不生效。disabled 的 <button> 不会参与表单提交，它的 value 被完全忽略——哪怕你手动调用 form.submit() 也一样。需要区分两种情况：
• 真实禁用：用 disabled，此时 value 无效；
• 视觉禁用但需保留提交能力：改用 aria-disabled="true" + CSS 控制样式，同时保留 value 和可提交性；
• 动态启用/禁用时，别只改 class，记得同步操作 disabled 属性，否则 value 行为会和预期不符。
最稳妥的做法：只要按钮参与表单提交，就显式设置 value，哪怕和显示文本一样；只要加了 disabled，就别指望它的 value 还能进请求体。
