🌈 搜索
📅  最后修改于: 2023-12-03 15:15:43.893000             🧑  作者: Mango
HTML5 中引入了 标签,用于创建模态对话框(modal dialog)。
模态对话框是一种特殊的窗口,它会锁定其他页面,使用户只能与对话框进行交互,直到对话框关闭。
<dialog id="myDialog"> <p>Hello, world!</p> <button id="closeDialog">Close</button> </dialog> <button id="openDialog">Open dialog</button> <script> // 获取对话框元素 var dialog = document.getElementById("myDialog"); // 获取打开对话框的按钮元素 var openDialogBtn = document.getElementById("openDialog"); // 获取关闭对话框的按钮元素 var closeDialogBtn = document.getElementById("closeDialog"); // 打开对话框 openDialogBtn.addEventListener("click", function() { dialog.showModal(); }); // 关闭对话框 closeDialogBtn.addEventListener("click", function() { dialog.close(); }); </script>
open
true
false
show()
showModal()
close()
background-color
border
box-shadow
height
left
position
top
width