JS创建页面遮罩层

以下是使用JavaScript创建页面遮罩层的示例代码：

HTML代码：

<button onclick="showOverlay()">显示遮罩层</button>

<div id="overlay" style="display:none;"></div>

CSS代码：

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

JavaScript代码：

function showOverlay() {
  var overlay = document.getElementById("overlay");
  overlay.style.display = "block";
}

function hideOverlay() {
  var overlay = document.getElementById("overlay");
  overlay.style.display = "none";
}

在上述代码中，当点击"显示遮罩层"按钮时，调用showOverlay()函数来显示遮罩层。遮罩层的display属性被设置为"block"，使其可见。当需要隐藏遮罩层时，调用hideOverlay()函数来隐藏遮罩层。遮罩层的display属性被设置为"none"，使其不可见。