检查单击选项卡时css类是否发生更改

<div class="tab">
  <div class="tab-item active" onclick="changeTab(1)">Tab 1</div>
  <div class="tab-item" onclick="changeTab(2)">Tab 2</div>
  <div class="tab-item" onclick="changeTab(3)">Tab 3</div>
</div>

.tab-item {
  /* 标准状态下的样式 */
}

.tab-item.active {
  /* 选中状态下的样式 */
}

function changeTab(tabIndex) {
  // 移除所有选项卡的"active"类
  var tabItems = document.getElementsByClassName("tab-item");
  for (var i = 0; i < tabItems.length; i++) {
    tabItems[i].classList.remove("active");
  }
  
  // 将被选中的选项卡添加"active"类
  var selectedTab = document.getElementsByClassName("tab-item")[tabIndex - 1];
  selectedTab.classList.add("active");
}