<html>
<meta charset="utf-8">
<head>
<script>
var hide=function()
{
var divs=document.getElementsByTagName("div");
for (var i=0;i<divs.length ;i++ )
{
divs[i].style.display="none";
}
}
window.onload=function(){
hide();
var a=document.getElementsByTagName("td");
for(var i = 0; i < a.length; i++)
{
a[i].onclick = function(oEvent)
{
oEvent = oEvent || event;hide();
document.getElementById("div"+this.id).style.display="block";
}
}
}
</script>
</head>
<body>
<table>
<tr>
<td id="1">
<a href="#">弹出层1</a>
</td>
<td id="2">
<a href="#">弹出层2</a>
</td>
<td id="3">
<a href="#">弹出层3</a>
</td>
</tr>
</table>
<div id="div1" style="background:#0F0; width:200px; height:100px;">
<p>层1 </p>
</div>
<div id="div2" style="background:#00F;width:200px; height:100px;">
<p>层2 </p>
</div>
<div id="div3" style="background:#F00;width:200px; height:100px;">
<p>层3 </p>
</div>
</body>
</html>
