"JQuery 테이블 비우기"의 두 판 사이의 차이

잔글 (봇: 자동으로 텍스트 교체 (-== 참고 자료 == +==참고==))
7번째 줄: 7번째 줄:
<script>
<script>
$(function () {
$(function () {
     $('#btn-empty').click( function() {
     $('#btn-delete').click( function() {
         $( '#mytable').empty();
         $( '#mytable').delete();
     });
     });
});
});

2019년 1월 11일 (금) 14:08 판

jQuery 테이블 비우기

1 예시 1: 전체 비우기

<script src="//code.jquery.com/jquery.min.js"></script>
<script>
$(function () {
    $('#btn-delete').click( function() {
        $( '#mytable').delete();
    });
});
</script>

<button id='btn-empty'>테이블 비우기</button>
<hr>

<table id="mytable" border="1" cellspacing="0">
    <tr>
        <th>컬럼1</th><th>컬럼2</th>
    </tr>
    <tbody>
        <tr><td>1</td><td>한놈</td></tr>
        <tr><td>2</td><td>두시기</td></tr>
        <tr><td>3</td><td>석삼</td></tr>
    </tbody>
</table>

2 예시 2: 헤더 제외하고 비우기

<script src="//code.jquery.com/jquery.min.js"></script>
<script>
$(function () {
    $('#btn-empty').click( function() {
        $( '#mytable > tbody').empty();
    });
});
</script>

<button id='btn-empty'>테이블 비우기</button>
<hr>

<table id="mytable" border="1" cellspacing="0">
    <thead>
        <th>컬럼1</th><th>컬럼2</th>
    </thead>
    <tbody>
        <tr><td>1</td><td>한놈</td></tr>
        <tr><td>2</td><td>두시기</td></tr>
        <tr><td>3</td><td>석삼</td></tr>
    </tbody>
</table>

3 같이 보기

4 참고

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}