더북(TheBook)

12.4.2 노드 삭제하기

노드를 추가할 수 있다면 당연히 삭제하는 것도 가능합니다. 노드를 삭제할 때는 removeChild() 메서드를 사용합니다. removeChild() 메서드는 부모 노드에 연결된 자식 노드를 삭제합니다.

형식

<부모 노드>.removeChild(<자식 노드>)

다음은 p 요소 노드를 찾아서 삭제하는 코드입니다. 삭제 노드는 항상 부모 노드에서 removeChild() 메서드를 사용해야 합니다. 따라서 부모 노드를 반환하는 parentNode 속성으로 부모 노드에 접근해서 삭제합니다.

12/04/removeChild.html

<body>
  <p>text 1</p>
  <a href="https://www.gilbut.co.kr">길벗</a>
  <a href="https://www.sucoding.kr">수코딩</a>
  <script>
    const pEl = document.querySelector("p");
    pEl.parentNode.removeChild(pEl);
  </script>
</body>
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.