Javascript 用于动态生成内容的自适应页面浏览器

作为一名JS noob，我现在陷入困境，非常感谢您的帮助。我的目标是拥有一个JS页面浏览器，可以处理我的CMS（TYPO3）生成的内容。不同页面的内容以DIV形式呈现，并带有语音ID；下面是指向这些锚的链接以及“全部显示”链接。当你点击一个链接到一个“页面”时，相应的页面内容div被显示，其他的被隐藏；如果单击“全部显示”，将显示所有页面内容div。但是，如果我在单击“show all”后单击页面链接，则并非所有其他页面内容div都应该隐藏。我猜这与JS处理顺序有关，但到目前为止还没有发现

window.onload=函数（）{
var pagelinks=document.querySelectorAll（“a.subpage-toggle”）；
对于（var i=0；i0）{
x[0].classList.remove（“活动”）；
}
if（（this.href.split（“#”）[1]）！==“全部显示”）{
//如果ID与链接的href匹配，则添加类“活动”
document.querySelector（“#”+this.href.split（“#”）classList.add（“active”）；
}否则{
var subpagecontents=document.getElementsByClassName（“子页面内容”），
len=子页面内容！==null？子页面内容。长度：0，
j=0；
对于（j；j
。子页面切换{
显示：块；
}
.子页面内容{
显示：无；
}
.subpage-content.active{
显示：块；
}


内容页1


内容页2


内容页3






您需要隐藏之前的所有显示，而不仅仅是第一个显示：

而不是

x[0]。类列表。删除（“活动”）

做：

Array.from（x）.forEach（（element）=>element.classList.remove（“active”）

非常感谢您！你对如何解决奖金任务（基于URL）也有想法吗？