Javascript 从列表中一次显示一个元素/div

我试图用一段代码隐藏同一个类的所有元素，但用ID显示一个元素。现在的实现方式是将div堆叠在彼此之上。一次只播放一个div

<script>
function CurtindoAlesadoDesktop() {
  var x = document.getElementById("curtindo-a-vida-alesado");
  if (x.style.display === "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
</script>

函数名为desktop（）{
var x=document.getElementById（“curtindo-a-vida-alesado”）；
如果（x.style.display==“块”）{
x、 style.display=“无”；
}否则{
x、 style.display=“block”；
}
}

---

正在使用的链接：maninhoflix.com.br（仅限桌面）

可能类似于以下内容

function showIdAndHideOthers(idToShow) {
  const elementsToHide = document.getElementsByClassName('class-to-hide');
  const elementToShow = document.getElementById(idToShow);
  for (const el of elementsToHide) {
    el.style.display = 'none';
  }
  elementToShow.style.display = 'block';
}

或者，您可以使用两个CSS类，一个默认情况下隐藏所有元素，另一个显示活动元素。然后，您可以跟踪最近显示的元素，只需添加/删除一个类

例如（CSS）：

JS:

---

编辑：第二个示例：

可能类似于以下内容

function showIdAndHideOthers(idToShow) {
  const elementsToHide = document.getElementsByClassName('class-to-hide');
  const elementToShow = document.getElementById(idToShow);
  for (const el of elementsToHide) {
    el.style.display = 'none';
  }
  elementToShow.style.display = 'block';
}

或者，您可以使用两个CSS类，一个默认情况下隐藏所有元素，另一个显示活动元素。然后，您可以跟踪最近显示的元素，只需添加/删除一个类

例如（CSS）：

JS:

---

编辑：第二个示例：

什么决定了哪个元素应该可见？对不起，我忘了提到我使用css隐藏div。设置为显示：无；一旦我点击一个按钮激活这个js代码，它就会变成block。我想icecub的问题是，显示/隐藏div的逻辑或规则是什么。从新的角度来看，你的问题似乎不完整。什么决定了哪个元素应该是可见的？对不起，我忘了提到我使用css隐藏div。设置为显示：无；一旦我点击一个按钮激活这个js代码，它就会变成block。我想icecub的问题是，显示/隐藏div的逻辑或规则是什么。从新的角度来看，你的问题似乎不完整。我会小心使用

.active

作为类名。还有一个问题可能会让阅读这段代码的人感到困惑。我无法让这段代码正常工作。为了让第二种方法工作，我必须同时使用这两种js代码吗？下面是一个功能完整的示例：非常感谢！就是这样！我会小心使用

.active

作为类名。还有一个问题可能会让阅读这段代码的人感到困惑。我无法让这段代码正常工作。为了让第二种方法工作，我必须同时使用这两种js代码吗？下面是一个功能完整的示例：非常感谢！就是这样！

let lastElement;
function showIdAndHideOthers(idToShow) {
  const elementToShow = document.getElementById(idToShow);
  if (lastElement != null) {
    lastElement.classList.remove('selected');
  }
  elementToShow.classList.add('selected');
  lastElement = elementToShow;
}