如何在单击按钮时将覆盖添加到正文中，以及如何清除页面加载中的紫色覆盖内容

<button id="overlayButton">点击添加覆盖</button>

document.getElementById("overlayButton").addEventListener("click", function() {
  // 在这里执行添加覆盖的操作
});

document.getElementById("overlayButton").addEventListener("click", function() {
  var 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 = "purple";
  overlay.style.opacity = "0.5";
  document.body.appendChild(overlay);
});

document.getElementById("overlayButton").addEventListener("click", function() {
  var 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 = "purple";
  overlay.style.opacity = "0.5";
  document.body.appendChild(overlay);

  // 在这里执行清除覆盖的操作
  setTimeout(function() {
    document.body.removeChild(overlay);
  }, 3000); // 3秒后清除覆盖
});