선택한 요소의 내용을 지우는 방법 - .empty()

.empty()

.empty()는 선택한 요소의 내용을 지웁니다. 내용만 지울 뿐 태그는 남아있다는 것에 주의합니다. 태그를 포함한 요소 전체를 제거할 때는 .remove()를 사용합니다.

 

기본형

.empty()

예를 들어

<h1>Lorem</h1>

일 때

$( 'h1' ).empty()

를 하면 다음처럼 바뀝니다.

<h1></h1>

 

예제

버튼을 클릭하면 p 요소의 내용이 지워집니다.

<button>Click To Empty</button>
<p>Lorem Ipsum Dolor</p>

p {
  padding: 20px;
  background-color: #eeeeee;
}

$( document ).ready( function() {
  $( 'button' ).click( function() {
    $( 'p' ).empty();
  });
});