Javascript 如何将参数传递给getElementById方法？

在一种显示信息的方式上，8个面板（单击每个面板时，它会扩展下面的内容）-然而，我正在尝试添加样式，以便在单击一个面板（活动）时，背景颜色更新为绿色，并在单击新元素时删除。我似乎无法将

tabName

参数传递给

getElementById

，因此现在该参数被硬编码为

banking选项卡

（单击时会更新为绿色）。有没有人对remove函数的最佳解决方案和潜在方法有什么建议

函数onExpandFuncs（tabName）{ openTab（tabName）； styleTab（tabName）； } 函数openTab（tabName）{ 变量i，x； x=document.getElementsByCassName（'containerTab'）； 对于（i=0；i

*{
框大小：边框框；
}
身体{
保证金：0；
字体系列：Arial、Helvetica、无衬线字体；
}
/*网格：四个相等的列，彼此相邻浮动*/
.栏目{
背景色：黑色；
浮动：左；
宽度：25%；
高度：226px；
填充：50px；
文本对齐：居中；
字体大小：16px；
光标：指针；
颜色：白色；
}
.活动列{
背景颜色：绿色；
浮动：左；
宽度：25%；
高度：226px；
填充：50px；
文本对齐：居中；
字体大小：16px；
光标：指针；
颜色：白色；
}
.集装箱选项卡{
填充：20px；
颜色：白色；
}
/*清除列后的浮动*/
.罗：之后{
内容：''；
显示：表格；
明确：两者皆有；
}
/*容器选项卡内的可关闭按钮*/
.关闭{
浮动：对；
颜色：白色；
字体大小：35px；
光标：指针；
}
.向下箭头{
宽度：25px；
高度：25px；
}

扩展网格
单击下面的框：

银行业务

雷格泰克

保险技术

借出

&时代；
银行业务

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
雷格泰克

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
保险技术

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
借出

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

会计

付款

报价聚合器

富科

&时代；
会计

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
付款

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
引用

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

&时代；
富科

同侧知识是一种可恶的理论，也是一种基本的理论
情报局，无因圣殿，乌兰科佩尔南。双色球误差
反歧视广告

您需要做的就是循环所有选项卡元素，并在每个选项卡上设置一个

单击
处理程序，该处理程序将设置的背景色，该背景色将表示处理事件的元素。无需知道或使用
id
（应尽可能避免使用，因为使用id会产生脆弱的代码）

还有

我已经删除了所有与这个问题无关的
onclick
属性，以避免它们的回调错误没有包含在这里的代码中


//将所有选项卡放入一个集合中
//（不要使用.getElementsByCassName（）！）
let tabs=document.queryselectoral（“.column”）；
//在所有选项卡上循环
tabs.forEach（函数（选项卡）{
//在每个选项卡上设置单击事件处理程序
tab.addEventListener（“单击”），函数（事件）{
//循环所有选项卡并删除活动类
tabs.forEach（函数（选项卡）{
tab.classList.remove（“活动列”）；
});
//设置已单击选项卡的背景
this.classList.add（“活动列”）；
});
});
*{
框大小：边框框；
}
身体{
保证金：0；
字体系列：Arial、Helvetica、无衬线字体；
}
/*网格：四个相等的列，彼此相邻浮动*/
.栏目{
背景色：黑色；
浮动：左；
宽度：25%；
高度：226px；
填充：50px；
文本对齐：居中；
字体大小：16px；
光标：指针；
颜色：白色；
}
.活动列{
背景颜色：绿色；
浮动：左；
宽度：25%；
高度：226px；
填充：50px；
文本对齐：居中；
字体大小：16px；
光标：指针；
颜色：