Javascript 展开所有和折叠所有表功能

我已经为葡萄酒区域和可折叠表创建了选项卡，以使用HTML、CSS和Javascript（感谢W3学校）在选项卡中显示各个葡萄酒数据。我正在努力使用一些功能，以便能够同时显示或隐藏可折叠酒杯中的所有葡萄酒

我希望能够为可折叠表提供两个选项：全部展开和全部折叠。这超出了我的专业知识范围

这是代码的一部分（选项卡和1个可折叠表）：

var coll=document.getElementsByClassName（“可折叠”）；
var i；
对于（i=0；i

/*设置选项卡的样式*/
.标签{
溢出：隐藏；
边框：1px实心#ccc；
背景色：#f1f1；
文字装饰：无；
}
/*设置选项卡内按钮的样式*/
@媒体屏幕和屏幕（最大宽度：600px）{
.选项卡按钮{
背景色：继承；
浮动：左；
边界：无；
大纲：无；
光标：指针；
填充：12px 12px；
过渡：0.3s；
字体大小：12.6px；
文字装饰：无；
}
}
@媒体屏幕和屏幕（最小宽度：768px）{
.选项卡按钮{
背景色：继承；
浮动：左；
边界：无；
大纲：无；
光标：指针；
填充：14px 16px；
过渡：0.3s；
字体大小：15px；
文字装饰：无；
}
}
/*更改悬停按钮的背景色*/
@媒体屏幕和屏幕（最大宽度：600px）{
.tab按钮：悬停{
背景色：#ddd；
}
}
@媒体屏幕和屏幕（最小宽度：768px）{
.tab按钮：悬停{
背景色：#ddd；
}
}
/*创建活动/当前tablink类*/
.tab按钮。激活{
背景色：#ccc；
文字装饰：无；
}
/*设置选项卡内容的样式*/
.tabcontent{
显示：无；
填充：6px 10px；
边框：1px实心#ccc；
边界顶部：无；
文本对齐：居中；
文字装饰：无；
}
.wp表tr:n个子项（奇数）{
背景色：#fff；
}
.wp表tr:n个子级（偶数）{
背景色：#f1f1；
}
.wp表格tr{
边框底部：1px实心#ddd；
}
.wp表th：第一个孩子，
.wp表td：第一个孩子{
左侧填充：12px；
}
.wp表td，
.wp表th{
填充：4px4px；
显示：表格单元格；
文本对齐：左对齐；
垂直对齐：中间对齐；
}
@媒体屏幕和屏幕（最大宽度：600px）{
.wp表th{
字体大小：粗体；
字体大小：12.6px
}
} 
@媒体屏幕和屏幕（最小宽度：768px）{
.wp表th{
字体大小：粗体；
字号：16px
}
} 
@媒体屏幕和屏幕（最大宽度：600px）{
.wp表格{
字体大小：12.6px！重要；
边框：1px实心#ccc；
边界塌陷：塌陷；
边界间距：0；
宽度：100%；
显示：表格；
}
}
@媒体屏幕和屏幕（最小宽度：768px）{
.wp表格{
字体大小：15px！重要；
边框：1px实心#ccc；
边界塌陷：塌陷；
边界间距：0；
宽度：100%；
显示：表格；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
.可折叠{
背景色：#777；
颜色：白色；
填充：12px；
页边顶部：1px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：12.6px；
}
}
@媒体屏幕和屏幕（最小宽度：768px）{
.可折叠{
背景色：#777；
颜色：白色；
填充：14px；
页边顶部：1px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
}
}
.活动，.可折叠：悬停{
背景色：#555；
文字装饰：下划线；
}
.可折叠：之后{
内容：“+”；
颜色：白色；
字体大小：粗体；
浮动：对；
左边距：5px；
}
.活动。可折叠：之后{
内容：“-”；
}
@媒体屏幕和屏幕（最大宽度：600px）{
.不可折叠{
背景色：#777；
颜色：白色；
填充：12px；
页边顶部：1px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：12.6px；
}
}
@媒体屏幕和屏幕（最小宽度：768px）{
.不可折叠{
背景色：#777；
颜色：白色；
填充：14px；
页边顶部：1px；
宽度：100%；
边界：无；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
}
}
.内容{
填充：0 10px；
显示：无；
溢出：隐藏；
背景色：#f1f1；
}
.非共点{
填充：0 10px；
溢出：隐藏；
背景色：#f1f1；
}


葡萄酒1
葡萄酒2
葡萄酒3
葡萄酒4
葡萄酒12
第1列
第2列
第3列
第4列
100604520002000480014/4/2021
100604520082008267014/4/2021
100604520092009234813/4/2021
100604520102010330015/4/2021
100604520112011259014/4/2021
10060452012201238005/4/2021
100604520132013230015/4/2021
100604520142014232014/4/2021
100604520152015255014/4/2021
100604520162016260014/4/2021
100604520172017276012/4/2021
10062051998199857408/4/2021
100620520002000945015/4/2021
100620520082008433214/4/2021 
葡萄酒15
第1列
第2列
第3列
第4列
100620520092009850014/4/2021
100620520102010960015/4/2021
100620520112011420015/4/2021
100620520122012400015/4/2021
100620520132013384012/4/2021
100620520142014420015/4/2021
100620520152015628012/4/2021
100620520162016704014/4/2021
100620520172017480015/4/2021 
葡萄酒20
第1列
第2列
第3列
第4列
10071012008200890013/4/2021
10071012009200995014/4/2021
10071012010201095015/4
.content {
  padding: 0 10px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
}

.collapsible.active .content {
   display:block;
}