[JavaScript] 자바스크립트에서 요소 자신 삭제하기

2022. 7. 6. 16:37Program/JavaScript

140_자바스크립트에서 요소 자신 삭제하기

[적용]

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

[문법]

메소드 의미 반환
노드.remove() 요소를 제거  없음

[내용]

remove()는 요소 자신을 제거하므로 부모 요소를 통해 요소를 제거하는 removeChild()와 다르다.

 

HTML                                                                                                                                                              index.html

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

JavaScript                                                                                                                                                          main.js

// 3초후 처리가 실행
setTimeout(() => {
  const childElement = document.querySelector('#child');
  // #child 요소 제거
  childElement.remove();
}, 3000);

 

실행결과

removeChild()와 같은 방식으로 3초 후 요소가 제거된다.


 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김