jquery datatable 是一個非常方便的表格插件,它可以簡單易用地幫助我們創(chuàng)建各種數(shù)據(jù)表格。在實(shí)際使用中,有時候需要在表格中增加一行數(shù)據(jù),下面我們來看看如何使用jquery datatable 來增加一行。
首先,我們需要在代碼中引入 jquery datatable 的庫文件,這里以最新版本為例:
<link rel="stylesheet" type="text/css" > <script type="text/javascript" src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.js"></script>
然后,我們需要準(zhǔn)備好表格的 HTML 結(jié)構(gòu),在這個例子中,我們使用一個 id 為 table 的 table 標(biāo)簽:
<table id="table"> <thead> <tr> <th>姓名</th> <th>年齡</th> <th>性別</th> </tr> </thead> <tbody> <tr> <td>張三</td> <td>28</td> <td>男</td> </tr> <tr> <td>李四</td> <td>25</td> <td>女</td> </tr> </tbody> </table>
接下來就是增加行的關(guān)鍵代碼了,我們可以使用 jquery 的 append() 方法來向表格中添加一行新數(shù)據(jù):
$('#table tbody').append('<tr><td>王五</td><td>30</td><td>男</td></tr>');
這樣,我們就成功地向表格中增加了一行新數(shù)據(jù)。代碼中的 #table tbody 就是我們要操作的表格內(nèi)容,通過 jQuery 的 append() 方法,我們向 tbody 中添加了一行新數(shù)據(jù)。你也可以根據(jù)實(shí)際需求來動態(tài)生成這段添加數(shù)據(jù)的代碼。