• 카테고리

    질문 & 답변
  • 세부 분야

    프로그래밍 언어

  • 해결 여부

    미해결

삭제를 다 하고 싶은데요,,,

22.11.29 14:32 작성 조회수 226

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());

감사합니다.