现代HTML创建模态弹窗方法详解

<dialog id="myDialog">
  <h3>提示信息</h3>
  <p>这是一条模态弹窗内容。</p>
  <button id="closeBtn">关闭</button>
</dialog>

<button id="openBtn">打开弹窗</button>

const dialog = document.getElementById("myDialog");
const openBtn = document.getElementById("openBtn");
const closeBtn = document.getElementById("closeBtn");

// 打开模态弹窗
openBtn.addEventListener("click", () => {
  dialog.showModal();
});

// 关闭模态弹窗
closeBtn.addEventListener("click", () => {
  dialog.close();
});