使用JavaScript单击时使选项卡处于活动状态

<div id="tab1">选项卡1</div>
<div id="tab2">选项卡2</div>
<div id="tab3">选项卡3</div>

document.getElementById("tab1").addEventListener("click", function() {
  // 处理选项卡1的点击事件
});

document.getElementById("tab2").addEventListener("click", function() {
  // 处理选项卡2的点击事件
});

document.getElementById("tab3").addEventListener("click", function() {
  // 处理选项卡3的点击事件
});

document.getElementById("tab1").addEventListener("click", function() {
  // 移除其他选项卡的活动状态
  document.getElementById("tab2").classList.remove("active");
  document.getElementById("tab3").classList.remove("active");

  // 添加活动状态到选项卡1
  document.getElementById("tab1").classList.add("active");
});

// 同样的方式处理其他选项卡的点击事件

.active {
  background-color: #f0f0f0;
  color: #000;
  /* 其他样式属性 */
}