[JavaScript] 자식 노드 모두 삭제하기

JavaScript

 

부모노드에서 자식노드를 모두 지우고 싶은데 잘 되지 않을때가 많다.

 

아래 예시를 보자

const 부모노드 = document.querySelector(
  ".부모노드클래스이름"
);
while (부모노드.hasChildNodes()) {	// 부모노드가 자식이 있는지 여부를 알아낸다
  부모노드.removeChild(
    부모노드.firstChild
  );
}

 

 

원래 removeChild 메서드는 removeChild(지울 자식노드)를 적어줘야하는데, 위의 코드는 부모노드의 첫번째 자식을 계속해서 하나씩 반복문으로 지우는 방식이다.

 

간단하게 사용할 수 있으니 편하게 사용하면 될 듯하다.