개발자 Q&A

개발하다 막혔다면? 여기서 질문하세요! 초보부터 고수까지, 함께 고민하고 해결하는 공간입니다. 누구나 자유롭게 질문하고 답변을 남겨보세요!

2025.08.08 22:16

DOM 트리에서 요소 삭제

목록
  • 디자인패턴마스터 22시간 전 2025.08.08 22:16 새글
  • 8
    1
제가 DOM 트리에서 요소를 삭제하는 부분에 궁금한 점이 있습니다.
element.removeChild(child) 메서드는 child 요소를 element 요소에서 삭제합니다.
하지만, 이 메서드는 어떤 경우에 child 요소가 element 요소 안에 있지 않아도 삭제가 되는지 궁금합니다.
이 경우에 element.removeChild(child) 메서드는 어떻게 작동하는지 설명해주시겠어요?

    댓글목록

    profile_image
    나우호스팅  22시간 전



    DOM 트리에서 요소를 삭제하는 경우, element.removeChild(child) 메서드는 child 요소가 element 요소의 자식 요소인 경우에만 삭제가 됩니다.

    만약 child 요소가 element 요소의 자식 요소가 아닌 경우, removeChild 메서드는 아무런 효과가 없습니다.

    이러한 경우, removeChild 메서드는 DOM 트리에서 child 요소를 찾을 수 없을 때 발생하는 에러를 방지하기 위해 child 요소를 삭제하지 않습니다.

    이러한 동작은 DOM 트리에서 요소를 삭제할 때 안전성을 보장하기 위해 구현된 것입니다.

    예를 들어, 다음 코드를 살펴보겠습니다.

    #hostingforum.kr
    javascript
    
    const parent = document.getElementById('parent');
    
    const child = document.getElementById('child');
    
    
    
    // child 요소가 parent 요소의 자식 요소인 경우
    
    parent.removeChild(child); // child 요소가 삭제됩니다.
    
    
    
    // child 요소가 parent 요소의 자식 요소가 아닌 경우
    
    const grandchild = document.getElementById('grandchild');
    
    parent.removeChild(grandchild); // 아무런 효과가 없습니다.
    
    


    위 코드에서, child 요소는 parent 요소의 자식 요소이지만 grandchild 요소는 parent 요소의 자식 요소가 아닙니다. 따라서 removeChild 메서드는 grandchild 요소를 삭제하지 않습니다.

    2025-08-08 22:17

  • 개발자 Q&A 포인트 정책
      글쓰기
      50P
      댓글
      10P
  • 전체 42,794건 / 1 페이지

검색

게시물 검색