document.querySelectorAll로 선택한 요소에 addEventListener가 안되는 이유(수정)

document.querySelectorAll은 NodeCollection을 반환하기 때문이다.

(반대로 document.querySelector는 단일 DOM 객체를 반환한다)
NodeCollection은 숫자 인덱스가 있고 길이 속성을 갖고 있지만, 배열은 아니므로 forEach등의 함수를 호출할 수 없다.

따라서 반복문 또는 forEach를 통해 DOM요소 하나하나에 AddEventListener를 적용해야 한다 

let selectAll = document.querySelectorAll("input[name='example']")

// [X]
selectAll.addEventListener('change', ()=>{...}); 

// [O]
for(let i=0; i<selectAll.length; i++) {
	selectAll[i].addEventListener('change', ()=>{...});
}

// [O]
selectAll.forEach(i => i.addEventListener('change', ()=>{...});