.empty() (DOM 제거 메서드)

엘리먼트 집합에서 대상 엘리먼트의 자식 노드를 DOM에서 제거한다.

매개변수

없음

반환값

메서드 연쇄 호출을 지원하는 jQuery 객체

설명

.empty() 메서드는 대상 엘리먼트의 자식 엘리먼트뿐 아니라 DOM 규격에 따라 자식 노드로 취급되는 자식 텍스트 노드까지도 모두 제거한다. 다음과 같은 HTML 코드가 있다고 해보자.

<div class="container">

    <div class="hello">Hello</div>

    <div class="goodbye">Goodbye</div>

</div>

콘텐츠를 비울 엘리먼트로는 어떤 것이든 지정할 수 있다.

$('.hello').empty();

그러면 DOM 구조에서 "Hello"라는 텍스트가 삭제된다.

<div class="container">

    <div class="hello"></div>

    <div class="goodbye">Goodbye</div>

</div>

만약 <div class="hello"> 안에 엘리먼트가 중첩돼 있었더라도 모두 제거될 것이다. 아울러 데이터나 이벤트 핸들러와 같은 다른 jQuery 구성요소들도 제거된다.