[jQuery] jQuery empty 메소드를 사용하여 특정 테이블의 내용 삭제

jQuery는 HTML 요소 선택, 조작 및 이벤트 처리를 위한 강력한 라이브러리입니다. 특히 특정 요소의 내용을 삭제하는 데 유용한 empty 메소드가 있습니다. 이 글에서는 jQuery를 사용하여 특정 테이블의 내용을 삭제하는 방법에 대해 알아보겠습니다.

1. HTML 테이블 구조

먼저 삭제할 테이블의 구조를 살펴봅시다. 예를 들어, 다음과 같은 HTML 테이블이 있다고 가정해 봅시다.

<table id="myTable">
  <tr>
    <th>이름</th>
    <th>나이</th>
  </tr>
  <tr>
    <td>홍길동</td>
    <td>30</td>
  </tr>
  <tr>
    <td>김철수</td>
    <td>25</td>
  </tr>
</table>

2. jQuery를 사용하여 테이블의 내용 삭제

이제 jQuery를 사용하여 위의 테이블의 내용을 삭제해 봅시다. empty 메소드를 사용하여 myTable이라는 ID를 가진 테이블의 모든 내용을 삭제할 수 있습니다.

$(document).ready(function(){
  $("#myTable").empty();
});

위의 코드는 문서가 준비된 후에(ready 이벤트) ID가 myTable인 테이블의 내용을 삭제합니다.

결과

위의 코드를 실행하면 myTable 테이블의 내용이 모두 삭제됩니다.

이제 empty 메소드를 사용하여 jQuery를 통해 특정 테이블의 내용을 삭제하는 방법에 대해 알게 되었습니다. 이를 응용하여 다양한 상황에 활용할 수 있을 것입니다.

참고: jQuery 공식 문서 - empty 메소드