작성
·
311
0
앞전 질문에서 앞에 추가하기도 X 버튼이 뜨게 잘 되었습니다. 감사드려요...복사하지 않고 입력을 해본다는게 그만 오타를 못찾는 바람에 안되었습니다.
한가지 더 추가로 해보려고 하는데, 타깃제거를 클릭하면 추가한 목록들을 다 지우게 하고 싶어서 수정을 해보았는데,,,,
추가버튼을 클릭할때 추가된 li에 item 이라는 클래스를 다 만들게 했구요
li.classList.add('item');
그랬더니 추가항목에 클래스가 잘 추가된거까지는 확인을 했습니다.
그런다음,,,
removeTargetBtn.addEventListener('click', function(){
let targetList = document.querySelectorAll('.item');
targetList.remove();
});
querrySelectorAll 로 추가된 클래스 item 를 모두 가져와서 remove를 했는데,,,,,
문법상으로 틀린게 있는거 같은데....ㅠㅠ
답변 1
0
안녕하세요 :)
querySelectAll()에 의해 반환된 객체는 NodeList 객체입니다.
const itemList = document.querySelectorAll('.item');
// 클래스 이름 출력
console.log(itemList.constructor.name); // NodeList
NodeList API에는 remove()라는 메서드를 지원하지 않습니다.
https://developer.mozilla.org/en-US/docs/Web/API/NodeList (NodeList API 참고)
아래와 같은 방법으로 삭제 가능합니다.
const itemList = document.querySelectorAll('.item');
itemList.forEach(item => item.remove());
감사합니다.