如何從沒有JQuery的元素的同胞中移除類？

我正在給一個元素添加一個類，並想從同級中刪除它。在JQuery中很簡單，但如何在普通的JS中做到這一點呢？這是我的代碼的一個例子。如何從沒有JQuery的元素的同胞中移除類？

<div class="controllers"> 
    <span id='one' class='active'></span> 
    <span id='two'></span> 
    <span id='three'></span> 
</div> 

firstBtn.onclick = function() { 
    slides[0].className = 'slide active'; 
    this.className = 'active'; 
};

來源

2016-10-20 Allan

看看這樣：[班級列表]（http://www.w3schools.com/jsref/prop_element_classlist.asp） –

從同級

var el = document.getElementById("two"); 
var one = el.previousSibling(); 
one.classList.remove("active");

previousSibling使用或nextSibling遍歷到它刪除類，並且使用classList.remove刪除的類。

來源

2016-10-20 11:32:18 gurvinder372

感謝。設法讓它與previousElementSibling一起工作。但是，如果我在第一個或其他方法後選擇第三個跨度，它實際上並不工作。 – Allan

您可以使用循環內部點擊事件從所有元素中刪除active類，然後再次將其設置在單擊的元素上。

var el = document.querySelectorAll('.controllers span'); 
 
for (let i = 0; i < el.length; i++) { 
 
    el[i].onclick = function() { 
 
    var c = 0; 
 
    while (c < el.length) { 
 
     el[c++].className = 'slide'; 
 
    } 
 
    el[i].className = 'slide active'; 
 
    }; 
 
}

.active { 
 
    color: red; 
 
}

<div class="controllers"> 
 
    <span id='one' class='active'>Lorem</span> 
 
    <span id='two'>Lorem</span> 
 
    <span id='three'>Lorem</span> 
 
</div>

來源

2016-10-20 11:51:28

如何從沒有JQuery的元素的同胞中移除類？

回答

相關問題