标题下方的标签在再次单击时消失，JavaScript不知道为什么

tags underneath headings disappear when clicked again w/ javascript no idea why

本文关键字：消失 JavaScript 为什么 不知道 单击 标签 标题      更新时间：2023-09-26

我已经粘贴了下面的javascript，但也粘贴了一个指向我的代码笔的链接，以便您可以确切地看到我在说什么。

我希望单击标题并显示下面的文本。 在另一次单击时，我希望文本返回到隐藏状态。 可以同时打开多个标题。我目前的设置正在发生的事情是，您可以单击一次以显示，再次单击以隐藏，然后当您再次单击以显示任何内容时，如果您继续单击下面的文本和标题，则会被吃掉/消失。 我宁愿在没有jquery的情况下这样做。 感谢您的任何帮助。

http://codepen.io/jrutishauser/pen/YPrrNa

 var clickToShow = function () { 
          if (this.nextElementSibling.className === 'open'){
                  this.nextElementSibling.remove('open');
          } else if (this.nextElementSibling.className != 'open') { 
          this.nextElementSibling.className = 'open';
          } 
  }; 
  var articleHeadings = document.getElementsByTagName('h3');
 for (var index = 0; index < articleHeadings.length; index++){
         articleHeadings[index].onclick = clickToShow;
 }
 var subArticleHeadings = document.getElementsByTagName('h4');
 for (var index2 = 0; index2 < subArticleHeadings.length; index2++){
         subArticleHeadings[index2].onclick = clickToShow;
 }

将this.nextElementSibling.remove('open')更改为this.nextElementSibling.className = ''。我相信 remove（） 方法删除了元素，而不是类。

你也可以

这样做。这是正确的做法。

var clickToShow = function () { 
      element=this.nextElementSibling;
          if (element.className === 'open'){
              element.className=element.className.replace('open','');
          } else if (element.className != 'open') { 
          element.className = 'open';
          } 
  };
相关文章：