인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

Inflearn Community Q&A

gangsugi5753's profile image
gangsugi5753

asked

Introduction to ES6+ Latest JavaScript for Beginners

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

Written on

·

320

0

앞전 질문에서 앞에 추가하기도 X 버튼이 뜨게 잘 되었습니다. 감사드려요...복사하지 않고 입력을 해본다는게 그만 오타를 못찾는 바람에 안되었습니다.

한가지 더 추가로 해보려고 하는데, 타깃제거를 클릭하면 추가한 목록들을 다 지우게 하고 싶어서 수정을 해보았는데,,,,

추가버튼을 클릭할때 추가된 li에 item 이라는 클래스를 다 만들게 했구요

 

li.classList.add('item');

그랬더니 추가항목에 클래스가 잘 추가된거까지는 확인을 했습니다.

그런다음,,,

removeTargetBtn.addEventListener('click', function(){
        let targetList = document.querySelectorAll('.item');
        targetList.remove();
      });

querrySelectorAll 로 추가된 클래스 item 를 모두 가져와서 remove를 했는데,,,,,

문법상으로 틀린게 있는거 같은데....ㅠㅠ

 

es6javascript

Answer 1

0

gymcoding님의 프로필 이미지
gymcoding
Instructor

안녕하세요 :)
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());

감사합니다.

 

gangsugi5753's profile image
gangsugi5753

asked

Ask a question