js怎么让已经显示的div,在其他点击事件触发的时候隐藏起来

发布网友发布时间：2022-04-07 08:57

共1个回答

热心网友时间：2022-04-07 10:27

这个是源代码,可以实现你的功能,有不懂的可以问我,希望采纳,谢谢

<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
window.onload=function()
{
var oDiv=document.getElementById("div1");
var oP=oDiv.getElementsByTagName("p");
var aDiv=oDiv.getElementsByTagName("div");
for(i=0;i<oP.length;i++)
{
oP[i].index=i;
//alert(oP.length);
oP[i].onclick=function()
{
for(j=0;j<aDiv.length;j++)
{
aDiv[j].style.display="none";
}
//alert(this.index);
aDiv[this.index].style.display="block";
}
}
}
</script>
<style>
.hidediv{
display:none;
height:100px;
width:100px;
background:#CF3;
}
</style>
</head>

<body>
<div id="div1">
<p>第一个div</p>
    <div class="hidediv">gerg </div>
    <p>第2个div</p>
    <div class="hidediv">wgw </div>
    <p>第3个div</p>
    <div class="hidediv">ggt </div>
    <p>第4个div</p>
    <div class="hidediv"> tgt</div>
</div>
</body>
</html>