表单提交需设 method="dialog"，点击 submit 按钮自动关闭并赋值 dialog.returnValue；否则静默失败。需监听 close 事件读取返回值，手动重置表单，并为旧浏览器降级为语义化 。
<dialog></dialog> 表单提交不是靠 form.submit() 触发页面跳转，而是靠 form[method="dialog"] + dialog.close() 配合实现——提交即关闭，且返回值可捕获。用错方式会导致表单静默失败、遮罩不生效、键盘焦点失控。
dialog 中 form 必须设 method="dialog"
原生 <dialog></dialog> 不认 method="post" 或 method="get"。只要没写 method="dialog"，点击按钮后对话框不会关闭，dialog.returnValue 也不会被赋值，后续 JS 拿不到用户选择。
- 正确写法：
<form method="dialog"><button type="submit" value="confirm">确定</button></form> - 错误写法：
<form method="post">...</form>（此时 submit 会尝试跳转或刷新页面） - 如果需要异步提交（如发 AJAX），就不能依赖
method="dialog"的自动关闭逻辑，得手动调用dialog.close(result)
showModal() 后必须处理 dialog.returnValue
用户点击 type="submit" 的按钮后，<dialog></dialog> 自动关闭，但它的返回值只存在 dialog.returnValue 属性里，不会自动传给回调函数或事件参数。
- 监听
close事件才能拿到结果：dialog.addEventListener('close', () => console.log(dialog.returnValue)) - 按钮的
value属性决定returnValue值（如<button value="cancel">取消</button>→dialog.returnValue === "cancel"） - 若按钮没设
value，returnValue是空字符串，容易误判
dialog 提交后无法自动清空表单？
<dialog></dialog> 关闭后 DOM 还在，表单字段值不会重置。下次打开时显示上次输入内容，对多轮操作极不友好。
立即学习“前端免费学习笔记（深入）”；
- 推荐在
close事件里手动重置：dialog.addEventListener('close', () => form.reset()) - 别用
form.innerHTML = form.outerHTML，会丢失事件绑定和 focus 状态 - 如果用了
autofocus，重置后需再调一次input.focus()，否则首次打开无焦点
IE 和旧版 Safari 不支持 dialog，fallback 怎么做？
<dialog></dialog> 在 Safari 15.4+、Chrome 37+、Firefox 98+ 才稳定支持；IE 完全不支持。检测不到时，必须降级为 <div role="dialog"> + 手动管理焦点和遮罩。<ul>
<li>检测方式：<code>if (!('showModal' in HTMLDialogElement.prototype)) { /* 降级逻辑 */ }
tab 键焦点限制、Esc 关闭、aria-modal="true"
最易被忽略的是 dialog.returnValue 的读取时机：它只在 close 事件触发后有效，且只能读一次；在 showModal() 调用后立刻读是 undefined。别把它当 Promise 返回值用。
