js---弹出层效果

<script>
			
		   function show(p_id)
		   {
		   		//判断是否已存在，如果存在则删除
		   		var div = document.getElementById("showDiv");
		   		if (div){
		   			document.body.removeChild(div);
		   		}

		   		//新建一个div
	   			var showDiv=document.createElement("DIV");
	   			//设置id
		   		showDiv.id = "showDiv"

		   		//添加关闭按钮
		   		showDiv.innerHTML = "<div style='width:500px;height:50px;text-align:right'><input type='button' value='关闭' οnclick='disabale()'></div><div>"

		   		//新建一个iframe，放div中显示的页面
		        var iframe=document.createElement("IFRAME");
		        iframe.height = 500
		        iframe.width = 500
		        iframe.frameBorder="0"
		        showDiv.style.cssText+=";background-color:white;position:absolute;top:50px;left:400px;width:500px;height:600px;border:solid 1px gray;";
		        //通过这种方式可以向div中传参
		        iframe.src="showProduct.asp?p_id="+p_id;
				showDiv.appendChild(iframe);

				//添加
				document.body.appendChild(showDiv);

		   }
		   //移出弹出层
		   function disabale(){
		   		
		   		var div = document.getElementById("showDiv");
		   		document.body.removeChild(div);
		   }
		</script>