NodeList to Array
✍ NodeList
document.querySelectorAll()를 통해 1개 이상의 dom 객체가 존재할 경우, 노드의 콜렉션으로 리턴됨.
NodeList는 .map
, .reduce
, .filter
함수 사용이 불가능 함.
이런 경우에는 NodeList를 Array 로 변환 후 작업하면 된다.
How to
- Array.prototype.slice.call($NodeList)
- Array.from($NodeList)
- [...$NodeList]
(예제소스)
const $liArr = document.querySelectorAll("li");
// Err :: VM6049:1 Uncaught TypeError: document.querySelectorAll(...).filter is not a function
liArr.filter(item => true);
# case 1
Array.prototype.slice.call($liArr).filter(item => true); // [li1, li2, li3, ..]
# case 2
Array.from($liArr).filter(item => true); // [li1, li2, li3, ..]
# case 3
[...$liArr].filter(item => true); // [li1, li2, li3, ..]
[참고] https://developer.mozilla.org/ko/docs/Web/API/NodeList
Author And Source
이 문제에 관하여(NodeList to Array), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@dev_tuktack/NodeList-to-Array저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)