javascript - 基于元素而不是其他元素删除类

Question

我在这个侧滚动网站上有这些部分。并且想要添加一个类，该类将根据您是否在某个部分更改样式。

我正在研究这个功能。顶部决定了您正在查看的横向滚动条的部分。

let 变量和下面是它停止工作的地方。我正在尝试使用它，因此如果单击非Home ID 部分，例如“slide-1”，则添加类“nav-visibilty”。如果它们匹配“slide-2”和“slide-2”，则删除该类。我接近了吗？

https://codepen.io/mikayp-the-styleful/pen/NWPxoXR?editors=1111

    setTimeout(function(){
      for (i=0; i < nonHome.length; i++ ){
        if (nonHome[i].id != nonHomeID){
          nonHome[i].classList.add("nav-visibility");
          console.log('add')
        } else{
          nonHomeID.classList.remove("nav-visibility");
            console.log('rem')
        }

      }

标签： javascript

Answer 1

只需将它们全部隐藏，然后显示单击的那个：

function showSection(id) {
  var sections = document.getElementsByTagName("section");
  for(var i=0; i<sections.length; i++) sections[i].classList.remove("nav-visibility");

  var current = document.getElementById(id);
  current.classList.add("nav-visibility");

}

示例：showSection("foo") 将从所有部分中删除导航可见性，然后将其添加到 id 为 foo 的部分。