dialog 默认不渲染且需调用 showmodal() 激活；必须置于 body 直接子级，确保首个可聚焦元素存在，并手动处理 backdrop 点击关闭。
dialog 标签不是写完就能弹的“自动弹窗”，它默认不渲染、不占布局、不响应交互——必须调用 showModal() 才能真正激活模态行为，否则页面上根本看不到它。
为什么写了 dialog 却完全没显示？
因为 dialog 默认 display: none，连 DOM 渲染都跳过，不是“隐藏”而是“未激活”。光加 open 属性只影响初始状态，且会强制一打开就弹出，违背用户触发原则。
- 错误做法：
<dialog open></dialog>+ 后续设dialog.open = false→ 弹窗仍在，open属性只是初始化开关，不是控制接口 - 正确做法：只写
<dialog id="myDialog"></dialog>，等用户点击后执行document.getElementById('myDialog').showModal() - 常见报错
Cannot read property 'showModal' of null：脚本执行早于 DOM 解析，需确保在DOMContentLoaded后获取元素，或把 script 放在
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
