js dialog

// 创建一个简单的对话框示例

// 使用原生 JavaScript 创建一个确认对话框
let userResponse = confirm("你确定要继续吗？");

if (userResponse) {
    alert("你选择了确定！");
} else {
    alert("你选择了取消！");
}

// 使用自定义的对话框（例如使用模态框）
function openCustomDialog() {
    // 创建一个 div 元素作为模态框背景
    let modalBackdrop = document.createElement('div');
    modalBackdrop.style.position = 'fixed';
    modalBackdrop.style.top = '0';
    modalBackdrop.style.left = '0';
    modalBackdrop.style.width = '100%';
    modalBackdrop.style.height = '100%';
    modalBackdrop.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';
    modalBackdrop.style.display = 'flex';
    modalBackdrop.style.justifyContent = 'center';
    modalBackdrop.style.alignItems = 'center';

    // 创建一个 div 元素作为模态框内容
    let modalContent = document.createElement('div');
    modalContent.style.backgroundColor = 'white';
    modalContent.style.padding = '20px';
    modalContent.style.borderRadius = '8px';
    modalContent.style.textAlign = 'center';

    // 添加文本到模态框内容中
    modalContent.innerHTML = `
        <p>这是一个自定义对话框</p>
        <button id="closeModal">关闭</button>
    `;

    // 将模态框内容添加到模态框背景中
    modalBackdrop.appendChild(modalContent);

    // 将模态框背景添加到文档中
    document.body.appendChild(modalBackdrop);

    // 添加关闭按钮点击事件
    document.getElementById('closeModal').addEventListener('click', function() {
        document.body.removeChild(modalBackdrop);
    });
}

// 调用函数打开自定义对话框
openCustomDialog();

解释说明：

1. confirm 对话框：这是浏览器自带的确认对话框，会弹出一个带有“确定”和“取消”按钮的窗口。用户选择后返回 true 或 false。
2. 自定义对话框：通过创建 div 元素模拟了一个模态框（modal），并添加了样式和关闭按钮。当点击关闭按钮时，模态框会从页面中移除。

如果需要更复杂的功能或样式，可以考虑使用第三方库如 Bootstrap 或 SweetAlert2。