[책] 자바스크립트 코드 레시피 278 - 126일차

요소를 동적으로 삭제하기

• 요소를 동적으로 삭제하고 싶을 때

구문

부모노드.removeChild(자식노드) 부모 요소에서 자식 요소 제거

설명

removeChild() 는 부모 요소에서 자식 요소를 제거합니다. #parend 요소 내 #child 요소를 3초 후 삭제하는 샘플을 확인합니다.

실습

index.html

<div id="parent">
  <div id="child">제거되는 요소</div>
</div>

---

script.js

setTimeout(() => {
  const parentElement = document.querySelector('#parent');
  const childElement = document.querySelector('#child');
  parentElement.removeChild(childElement); // #child 요소 제거
}, 3000);