<button>在<form>内未写type时默认为submit，是HTML规范要求；非提交按钮必须显式设type="button"，type="submit"触发submit事件并自动提交表单，type="button"仅触发click且不参与表单流程。
没写 type 的 <button> 在 <form> 里默认是 submit
只要 <button> 出现在 <form> 标签内部，又没显式写 type 属性，所有现代浏览器（Chrome/Firefox/Safari）都会把它当 type="submit" 处理——这不是 bug，是 HTML 规范强制要求的行为。
常见翻车现象包括：
- 点了“取消”或“清空搜索框”按钮，页面突然刷新
- React 组件里绑了
onClick，但函数根本没执行，控制台也无报错 - SSR 模板中变量未兜底
type，上线后部分页面偶发提交空表单
修复方式极简单：所有非提交用途的按钮，一律显式声明 type="button"。哪怕当前不在 <form> 里，也建议提前加，避免后续重构漏改。
type="submit" 和 type="button" 的事件拦截逻辑完全不同
type="submit" 触发的是表单的 submit 事件，不是普通 click；而 type="button" 只触发 click，完全不进表单生命周期。
立即学习“前端免费学习笔记（深入）”；
想阻止提交，必须在 <form> 上监听 submit 并调用 event.preventDefault()。只给按钮加 onclick="event.preventDefault()" 是无效的——原生提交早已触发并跳转。
关键区别：
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
type="submit"：自动收集同级<form>内所有带name的<input>/<select>/<textarea>，按method和action提交；即使action为空，也会刷新页面 -
type="button"：不收集字段、不触发submit或reset事件、不参与表单验证；纯靠 JS 控制，适合模态框开关、搜索清空、AJAX 请求等
type="reset" 不是“清空”，它只还原 HTML 初始值
type="reset" 的行为非常严格：它只把 <input value="张三"> 恢复成 "张三"，把没写 value 的 <input> 变为空字符串。
它不管 JS 动态设置的 input.value = "李四"，也不管 React 的 v-model 或 useState 更新的状态。
另外注意：type="reset" 不会触发 change 或 input 事件，依赖这些事件更新 UI 的逻辑完全收不到通知。
非法 type 值（比如 type="click"、type=""）在 <form> 内会被降级为 submit
浏览器对非法 type 值的处理是不可控的：直接当作 type="submit" 处理，导致意外提交。
务必避免以下写法：
<button type="click"></button><button type=""></button>-
<button></button>（在<form>内时）
<button type="button"> 是现代项目的默认首选——它支持嵌套任意 HTML、伪元素、更好的可访问性，且语义明确。别图省事漏写 type，这个细节一旦漏掉，调试成本远高于敲那几个字符。
