JavaScript 全屏加载遮罩 - 6秒自动消失

以下是一段 JavaScript 代码，用于展示一个 6 秒后自动消失的全屏加载遮罩：

// 创建遮罩元素
const overlay = document.createElement('div');
overlay.style.position = 'fixed';
overlay.style.top = '0';
overlay.style.left = '0';
overlay.style.width = '100%';
overlay.style.height = '100%';
overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';
overlay.style.display = 'flex';
overlay.style.justifyContent = 'center';
overlay.style.alignItems = 'center';
overlay.innerHTML = '<span>Loading...</span>';
document.body.appendChild(overlay);

// 定时器，6 秒后隐藏遮罩
const timer = setTimeout(() => {
  overlay.style.display = 'none';
}, 6000);

这段代码首先创建了一个全屏的遮罩元素，然后使用定时器在 6 秒后隐藏遮罩。在遮罩中心显示了 'Loading...' 文本。您可以根据需要修改遮罩的样式和显示内容。

自定义选项:

• 遮罩背景颜色: overlay.style.backgroundColor 可以更改遮罩的背景颜色。
• 加载文字: overlay.innerHTML 可以更改加载文字内容。
• 显示时间: setTimeout 函数中的第二个参数可以更改遮罩显示时间。

通过修改这些选项，您可以创建适合您项目的自定义加载遮罩。