Javascript未打开/关闭手风琴

我尝试了几种不同的方法，但不知道为什么my.JS不能打开和关闭我的手风琴。请检查我的密码。谢谢你的帮助

var acc=document.getElementsByClassName（“accordion”）；
var i；
对于（i=0；i

正文{
文本对齐：居中；
背景色：#ffffff；
}
h1{
字体：40px信使新；
文本对齐：居中；
}
a{
字体：25px arial；
文本对齐：居中；
}
.手风琴{
背景色：#eee；
颜色：#444；
光标：指针；
填充：18px；
宽度：60%；
文本对齐：居中；
边界：无；
大纲：无；
过渡：0.4s；
}
.活动，.手风琴：悬停{
背景色：#ccc；
}
.小组{
填充：0 18px；
背景色：白色；
溢出：隐藏；
字体：16px源代码Sans-Pro；
宽度：60%；
保证金：0自动；
显示：无；
高度：200px自动
}
p{
文本对齐：居中；
}

关于我们网页地图

问题在于：

var acc = document.getElementsByClassName("accordion");

HTML文件中没有“accordion”类，这就是它无法识别的原因。你必须拿一个按钮，给它分配一个名为accordion的类，然后它才能正常工作

var acc=document.getElementsByClassName（“accordion”）；
var i；
对于（i=0；i

手风琴{ 背景色：#eee； 颜色：#444； 光标：指针； 填充：18px； 宽度：100%； 边界：无； 文本对齐：左对齐； 大纲：无； 字体大小：15px； 过渡：0.4s； } .主动， .手风琴：悬停{ 背景色：#ccc； } .小组{ 填充：0 18px； 显示：无； 背景色：白色； 溢出：隐藏； }

个人
这里是私人的

成就
这里的成就

历史
这里的历史

我建议重构一些代码，使其更具可读性，例如

HTML

CSS

---

除了重构之外，我看不到类名为accordion的元素。似乎您缺少了包含实际

accordion

的HTML，在给定的标记中看不到任何accordion元素。您还可以将href更改为href=“#”请添加您的CSS和代码。所以我们可以理解。我建议不要使用

HTMLButtonElement

，因为它们意味着

HTMLFormElement

-功能。更好的选择是一个包含url

哈希值的
标记。对于任何非链接的内容，在语义上都有一个按钮是更好和正确的。手风琴就是一个很好的例子，我不同意。如果链接元素包含
hash
，并且存在具有该
id
的元素，则链接元素将执行
scrollIIntoView
。通过这种方式，我们可以确保基本的浏览器功能完好无损。在每个浏览器上，按钮元素的样式也不同，这迫使我们做更多的
样式设置
/
css
。
<a href="#item1" class="accordion">Item 1</a>
<div id="item1" class="accordion-content">This is my accordion Item 1 content</div>

<a href="#item2" class="accordion">Item 2</a>
<div id="item2" class="accordion-content">This is my accordion Item 2 content</div>

document.querySelectorAll(".accordion").forEach(function(node) {
    node.addEventListener("click", function(e) {
        this.nextElementSibling.toggleClass("active');
    });
});

.accordion-content:not(.active) {
    display: none;
}