為什麼 `forEach` 不能直接在 `HTMLCollection` 上運作？

使用Array.forEach 迭代HTMLCollection

在這種困境中，開發人員嘗試使用document.getElementsByClassName("myclass").forEach 迭代到錯誤，指出「.forEach 不是

理解HTMLCollection

解決此錯誤的關鍵在於理解getElementsByClassName 傳回結果的性質。微妙但重要的區別。轉換為陣列

要利用強大的forEach 方法，必須先將HTMLCollection 放入陣列中。 call:

使用[].forEach.call:

var els = document.getElementsByClassName("myclass");

Array.prototype.forEach.call(els, function(el) {
  // Do stuff here
  console.log(el.tagName);
});

使用Array.from (ES6):

[].forEach.call(els, function (el) {...});

透過將HTMLCollection 轉換為數組，可以轉換為數組利用大量的陣列方法（包括forEach）來有效率地處理和操作DOM 元素。

以上是為什麼 `forEach` 不能直接在 `HTMLCollection` 上運作？的詳細內容。更多資訊請關注PHP中文網其他相關文章！