本文为大家介绍下使用javascript实现的弹出层背景置灰-模拟(easyui dialog) 具体实现如下，感兴趣的朋友可以参考下

页面比较丑，只把功能实现了。^ ^  代码如下: <title>模仿easyui dialog的效果</title>  <script>  //取得页面元素  var getElement = function() {  return document.getElementById(arguments[0]) || false;  }  function openDialog(dialogId) {  var maskId = "mask";  //如果有，先删除原来的  if (getElement(dialogId)) {  document.removeChild(getElement(dialogId));//删除操作：弹出的div  }  if (getElement(maskId)) {  document.removeChild(getElement(maskId));//删除操作：弹出的不可操作(面具)层  }    //背景置灰  var maskDiv = document.createElement("div");  maskDiv.id = maskId;  maskDiv.style.position = "absolute";  maskDiv.style.zIndex = "1";  maskDiv.style.width = document.body.scrollWidth + "px";  maskDiv.style.height = document.body.scrollHeight + "px";  maskDiv.style.top = "0px";  maskDiv.style.left = "0px";  maskDiv.style.background = "gray";  maskDiv.style.filter = "alpha(opacity=10)";  maskDiv.style.opacity = "0.30";//透明度  document.body.appendChild(maskDiv);//向body之中增加背景层    //Dialog  var dialogDiv = document.createElement("div");  dialogDiv.id = dialogId;  dialogDiv.style.position = "absolute";  dialogDiv.style.zIndex = "9999";  dialogDiv.style.width = "400px";  dialogDiv.style.height = "200px";  dialogDiv.style.top = (parseInt(document.body.scrollHeight) - 200) / 2 + "px"; // 屏幕居中  dialogDiv.style.left = (parseInt(document.body.scrollWidth) - 400) / 2 + "px"; // 屏幕居中  dialogDiv.style.background = "white";  dialogDiv.style.border = "1px solid gray";  dialogDiv.style.padding = "5px";  dialogDiv.innerHTML = "(Dialog Content)";  //Dialog之中的关闭操作：关闭背景层和Dialog层  var closeControlloer = document.createElement("a");//创建一个超链接(做为关闭的触发)  closeControlloer.href = "#";  closeControlloer.innerHTML = "关闭";  closeControlloer.onclick = function() {  document.body.removeChild(getElement(dialogId));//删除diaglog  document.body.removeChild(getElement(maskId));//删除背景层  }  dialogDiv.appendChild(closeControlloer);//dialog之中增加"关闭"操作  document.body.appendChild(dialogDiv);//body之中增加dialog  }  </script>  <a href="#" onclick="openDialog('dialog');">Open Dialog</a>