Как преобразовать nodelist в массив js

Для преобразования в массив NodeList можно итерировать в цикле:

const nodeList = document.querySelectorAll('div');
const result = [];
for (const node of nodeList) {
  result.push(node);
}
console.log(result); // => [div#root, div.page-wrapper.document-page, ...]

Также у NodeList есть метод forEach:

const nodeList = document.querySelectorAll('div');
const result = [];
nodeList.forEach((node) => {
  result.push(node);
});
console.log(result); // => [div#root, div.page-wrapper.document-page, ...]

И самый простой способ преобразовать в массив, это использовать Array.from():

const nodeList = document.querySelectorAll('div');
const result = Array.from(nodeList);
console.log(result); // => [div#root, div.page-wrapper.document-page, ...]

nodeList - это массивоподобная коллекция узлов, которая возвращается методом document.querySelectorAll().

Сходство с обычным массивом заключается в том, что по nodeList можно проитерироваться методом forEach(), а различия в том, что для nodeList недоступны такие методы массивов, как map(), filter() и reduce().

Для обхода этого ограничения мы можем преобразовать nodeList в массив, используя spread оператор или метод Array.from().

• Преобразование с помощью spread оператора:

const divList = document.querySelectorAll('div');
const arr = [...divList];

• То же самое с помощью метода Array.from()

const arr = Array.from(divList);