jQuery를 이용하여 테이블 행 추가 예제

jQuery를 이용하여 테이블의 행을 쉽게 추가할 수 있다.

<script type="text/javascript"> function addLine(obj) { var tbl = $('#exampleTable'); //라인 추가 $(tbl).find('tr:last').after('<tr><td>추가된 라인!!</td></tr>'); } </script> <table border="1" id="exampleTable"> <tr> <td> <button onclick="addLine();">행 추가</button> </td> </tr> <tr> <td> Hello Brother! </td> </tr> </table>

설명 )

해당 테이블의 마지막 tr 을 구해서(tr:last)

이후에 원하는 엘리먼트를 직접 추가할 수 있다.

※ 다음과 같이 tbody 안에 append 처리 하여도 된다.

$(tbl).find('tbody').append('<tr><td>추가된 라인!!</td></tr>');