时间戳

首页 > 解决方案 > 显示另一个元素时如何隐藏一些元素？

javascript - 显示另一个元素时如何隐藏一些元素？

问题描述

我正在完成我的网站，并且我有一个脚本在按下按钮时隐藏或显示一个 div。

这是代码：

function display(id) {
    var e = document.getElementById(id);
    if (e.style.display === "none") {
        e.style.display = "block";
    } else {
        e.style.display = "none";
    }
}

但是这段代码并不是我真正想要的，因为我只希望可以同时显示一个 div（例如：如果 div 4 处于活动状态并且用户需要查看 div 2，则它必须隐藏第一个）。我刚刚将 JS 用于快速的事情，因此我不知道如何做到这一点。

也可以根据用户从哪个链接进入页面来隐藏特定的 div。

我的 html 示例：

<a onclick="display('1_1_1')">button</a>

<div id="1_1_1" class="well" style="display: none;"> 
    <h1>Title</h1>
</div>

谢谢您的帮助 ！

标签： javascripthtmlcss

解决方案

最好添加一个包含display: none类似的类

.no-display {
  display: none;
}

div然后当你点击一个喜欢的时候添加或删除那个类

parentDiv.addEventListener("click", function() {
  const elem = getElemenyById("elemID");
  if(something) {
    elem.classList.add("no-display");
  else if(something) {
    elem.classList.remove("no-display");
  };
});

推荐阅读