getElementsByClassName()で取得した要素を配列のように扱う方法

問題

getElementsByClassName()はHTMLCollection()が返却されるのでforEach()が使えませんでした。

const elements = document.getElementsByClassName('xxx');
console.log(elements) //HTMLCollection()

elements.forEach((e) => {}) // TypeError: elements.forEach is not a function

解決法

HTMLCollection()をなんとか配列にしてやればOKです。

Array.form()

const elements = Array.from(document.getElementsByClassName('xxx'));
console.log(elements) //[]

elements.forEach((e) => {}) // OK

[].slice.call()

const elements = [].slice.call(document.getElementsByClassName('xxx'));
console.log(elements) //[]

elements.forEach((e) => {}) // OK