ajax给表格添加行（demo）

一、表格代码

<table class="table table-bordered table-hover" >
<thead>
	<tr>
		<th>
			id
		</th>
		<th>
			选题名称
		</th>
		<th>
			老师
		</th>
		<th>
			状态
		</th>
		<th>
			选题
		</th>
	</tr>
</thead>
<tbody id="showTable">
	<tr>
		<td>
			1
		</td>
		<td>
			TB - Monthly
		</td>
		<td>
			01/04/2012
		</td>
		<td>
			<button type="button" >确认</button>
		</td>
	</tr>
	<tr>
		<td>
			2
		</td>
		<td>
			TB - Monthly
		</td>
		<td>
			01/04/2012
		</td>
		<td>
			<button type="button" >确认</button>
		</td>
	</tr>
</tbody>
</table>

二、ajax代码

$("#showTable").find("tr").remove()//清空原有表格数据
var list=data//数据
for(var item in list){
	var list_item=list[item]
	var trHTML = "<tr><td>"+list_item[0]+"</td><td>"+list_item[1]+"</td><td>"+list_item[2]+"</td><td>"+list_item[3]+"</td><td><button type='button' class='btn btn-default'>确认</button></td></tr>"
	$("#showTable").append(trHTML)//在表格后面新添加一行
			}