JavaScript 增加、刪除 table 內的 td

如果需要利用程式來增加Table內的tr、td等內容

<table id="myTable">
    <tr>
        <td>Row1 cell1</td>
        <td>Row1 cell2</td>
    </tr>
    <tr>
        <td>Row2 cell1</td>
        <td>Row2 cell2</td>
    </tr>
    <tr>
        <td>Row3 cell1</td>
        <td>Row3 cell2</td>
    </tr>
</table>

JavaScript寫法：

增加：

function myFunction(){
    //取得table元件
    var table = document.getElementById("myTable");

    //取的目前有的td數量
    var num = document.getElementById("myTable").rows.length;

    //從最後一筆開始加入
    var row = table.insertRow(num);

    //因為有兩個欄位 所以新增兩筆
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);

    //最後將兩筆的資料寫入
    cell1.innerHTML = "NEW CELL0";
    cell2.innerHTML = "NEW CELL2";
}

刪除：

function remove_data() 
{
    //先取得目前的row數
    var num = document.getElementById("mytable").rows.length;

    //防止把標題跟原本的第一個刪除XD
    if(num >2){
        //刪除最後一個
        document.getElementById("mytable").deleteRow(-1);
    }
}