我将如何制作一个使用纯JavaScript在点击时隐藏DIV的系统

How would I make a system that hides the DIV on click with pure JavaScript?

本文关键字：JavaScript 隐藏 系统 DIV 何制作 一个      更新时间：2023-09-26

所以，我正在制作一个网页。 它有一个固定的侧边栏，点击时隐藏...

我有两个较小的DIV指定用于隐藏和关闭（sideBarClose，sideBarOpen）

单击它们时

，它们按照隐藏主div 时的规定进行操作。

我希望用纯JavaScript来完成，而不是jQuery或其他东西。

我可以告诉你对JavaScript很陌生。 最好用jQuery来做，但是既然你想要JavaScript：

我会做这样的事情，

<script>
function hide()  {
    document.getElementById("mainDiv").style.display = "none";
    document.getElementById("sideBarOpen").style.display = "inline";
}
function unhide()  {
    document.getElementById("mainDiv").style.display = "inline";
    document.getElementById("sideBarClose").style.display = "none";
}
</script>

然后，在您的 html 中：

<div id="sideBarOpen" onclick="unhide()"></div>
<div id="mainDiv">
   <div id="sideBarClose" onclick="hide()">
</div>

通知！ 确保在样式中将sideBarClose 的显示设置为无：

#sideBarClose  {
display: none;
}
相关文章：