Javascript HTML/CSS Onclick divs自动隐藏

很抱歉，如果已经问过这个问题，但是我有两个onclick div，我想做的是：我打开第一个，但是当我打开第二个时，我希望第一个自动关闭，反之亦然

以下是HTML：

函数myFunction（）{
var x=document.getElementById（“myDIV”）；
如果（x.style.display==“无”）{
x、 style.display=“block”；
}否则{
x、 style.display=“无”；
}
}
函数myFunction2（）{
var x=document.getElementById（“myDIV2”）；
如果（x.style.display==“无”）{
x、 style.display=“block”；
}否则{
x、 style.display=“无”}
}

#myDIV{
位置：相对位置；
宽度：100%；
填充：50px0；
文本对齐：居中；
背景颜色：浅蓝色；
顶部：150px；
}
.按钮1{
位置：相对位置；
顶部：120像素
}
#myDIV2{
位置：相对位置；
宽度：100%；
填充：50px0；
文本对齐：居中；
背景颜色：浅蓝色；
}
.按钮2{
位置：相对位置；
}

试试看
这是我的DIV元素。
试试看
这是我的第二个DIV元素。

您需要在两个函数中同时获得两个div。然后隐藏任何一个你想要的，并显示另一个。您也只需要一个函数，因为它只是反转您已经做过的事情。我还使用z-index使按钮始终位于div的顶部：1；因为有一段时间它被藏在潜水舱下面

（这可以通过执行以下操作在现有代码中完成）

#myDIV{
位置：相对位置；
宽度：100%；
填充：50px0；
文本对齐：居中；
背景颜色：浅蓝色；
顶部：150px；
}
.按钮1{
位置：相对位置；
顶部：120像素
z指数：1；
}
#myDIV2{
位置：相对位置；
宽度：100%；
填充：50px0；
文本对齐：居中；
背景颜色：浅蓝色；
}
.按钮2{
位置：相对位置；
}

测试
试试看
这是我的DIV元素。
这是我的第二个DIV元素。
函数myFunction（）{
const x=document.getElementById（“myDIV”）；
const y=document.getElementById（“myDIV2”）；
如果（x.style.display==“无”）{
x、 style.display=“block”；
y、 style.display=“无”
}否则{
x、 style.display=“无”；
y、 style.display=“块”
}
}

重置函数中两个div的显示：

函数myFunction（）{var x=document.getElementById（“myDIV”）；var y=document.getElementById（“myDIV2”）；if（x.style.display==“none”）{x.style.display=“block”；y.style.display=“none”}else{x.style.display=“none”；}函数myFunction2（）{var y=document.getElementById（“myDIV”）；var x=document.getElementById（“myDIV2”）；if（x.style.display==“none”）{x.style.display=“block”；y.style.display=“none”；}其他{x.style.display=“none”；}