為什麼 getElementsByClassName() 只更改其他所有類別？

不需要的類別變更模式：受影響的所有其他類別

在JavaScript 中使用getElementsByClassName() 時，您面臨著挑戰。當嘗試變更每個元素的類別時，您會遇到僅修改所有其他類別的問題。

根本原因：HTMLCollection 的修改

根本原因此問題在於 getElementsByClassName() 傳回的 HTMLCollection 的性質。當您變更集合中元素的類別時，集合本身也會更新，並且不再包含該元素。這意味著當您迭代集合時，您實際上會跳過替代元素。

解：迭代數組

要解決此問題，您可以迭代原始集合的數組，而不是在繼續時修改集合。這可確保您將類別變更套用至每個元素，而不管先前的修改為何。

使用For 循環更新程式碼：

var blockSet = document.getElementsByClassName("block-default");
var blockSetLength = blockSet.length;

for (var i = 0; i < blockSetLength; i++) {
    blockSet[0].className = "block-selected";
}

註解：

• 您可以使用 for 循環來循環來使用代替單獨更改每個元素的類別迭代元素並更改類別。
• 此更新的程式碼將每次迭代的「區塊選擇」類別指派給 blockSet 陣列的第一個元素。
• 透過使用數組，您可以避免在迭代期間修改集合的問題。

以上是為什麼 getElementsByClassName() 只更改其他所有類別？的詳細內容。更多資訊請關注PHP中文網其他相關文章！