我想將一個活動類添加到一個 div 上的第二個跨度，其中兩個跨度與 javascript 具有相同的類

Question

我想在第二個跨度中添加一個活動類，並在使用 javascript 單擊“單擊我”時將其從第一個跨度中刪除

  <span class="click">Click me<span/>.
    
    
    
    <div class="subtab">
      
      <span class="first active" data-tabname="reviews" tabindex="0">Reviews</span>
      
      <span class="first " data-tabname="questions" tabindex="0">Questions </span>
      
</div>
  

Answer 1

這將起作用

HTML：

<div>
  <span class="span-class active">span 1</span>
  <span class="span-class">span 2</span>
</div>

<button id="btn">
alter
</button>

腳本：

let spanElements = document.getElementsByClassName("span-class");
let btn = document.getElementById("btn");

btn.addEventListener('click', () => {
  if(spanElements[0].classList.contains('active')) {
    spanElements[1].classList.add("active");
    spanElements[0].classList.remove("active");
  } else {
    spanElements[0].classList.add("active");
    spanElements[1].classList.remove("active");
  }
});

CSS

.active {
  color: red;
}