- jQuery 테이블 행 추가·삭제
- jQuery tr 추가/삭제
1 예시[ | ]
html
Copy
<style>
thead { background-color: skyblue; }
</style>
<button id='btn-add-row'>행 추가하기</button>
<button id='btn-delete-row'>행 삭제하기</button>
<hr>
<table id="mytable" border="1" cellspacing="0">
<thead>
<tr>
<th>ITEM</th>
<th>DATETIME</th>
</tr>
</thead>
<tbody></tbody>
</table>
<script src="//code.jquery.com/jquery.min.js"></script>
<script>
$('#btn-add-row').click(function() {
var time = new Date().toLocaleTimeString();
$('#mytable > tbody:last').append('<tr><td>HELLO world</td><td>' + time + '</td></tr>');
});
$('#btn-delete-row').click(function() {
$('#mytable > tbody > tr:last').remove();
});
</script>
2 같이 보기[ | ]
3 참고[ | ]
편집자 Jmnote
로그인하시면 댓글을 쓸 수 있습니다.