用原生JS腳本如何爲Table添加行？

之前介紹過用 Jquery爲table添加行。如果你沒有使用Jquery插件，或者對Jquery不熟悉，那麼能用原生的JS腳本爲Table添加行嗎?
可以的，下面我們一起來看下怎麼寫。

操作方法

（01）先看下初始的table，就是二行數據（二個tr),<table id="tbl" class="table table-bordered"> <tr> <td>1</td> <td>JS</td> <td>js</td> </tr> <tr> <td>2</td> <td>JS2</td> <td>JS2</td> </tr> </table>

（02）添加一個按鈕，用來點擊添加新的table行，<input type="button" class="btn btn-primary" value="原生JS添加Table行" onclick="add_tr()" />

（03）要爲table添加行tr， 我們可以用document對象的createElement方法，先生成tr對象，var tr = teElement("tr")；

（04）tr裏的元素是td，所以還要生成td對象，td裏的內容可以用 innerHTML來賦值，var td1 = teElement("td");rHTML = &#x27;3';一行tr有三個td，所以要生成三個td對象，每個對象的內容各自賦值

（05）把td單元格，放進tr對象，ndChild(td1);ndChild(td2);ndChild(td3);

（06）最後，把tr對象放進table,lementById('tbl')ndChild(tr);

（07）代碼邏輯基本完成，看下介面。

（08）點擊按鈕後，成功爲table添加了一行。

（09）多次點擊，可以爲table添加多行，如圖。