ผมเคยเขียนถึงการแทรกแถวลงในตารางมาครั้งหนึ่งแล้วด้วย document.createElement คราวนี้ผมจะบอกถึงอีกวิธีการหนึ่งในการแทรกแถวโดยใช้ฟังก์ชั่นของตารางโดยตรงด้วย insertRow() และ insertCell()

<script>
        function InsertNewRow () {
            // ตาราง
            var table = document.getElementById ("table");
            // แทรกแถวลงในตารางที่แถว 1
            var row = table.insertRow(1);
            // แทรกคอลัมน์แรก (0) ลงในแถวที่สร้างใหม่
            var cell = row.insertCell(0);
            // ใส่ข้อความลงในตาราง
            cell.appendChild(document.createTextNode('แถว ' + table.rows.length))
        }
</script>
<button onclick="InsertNewRow ();">แทรกแถวใหม่</button>
<table id="table">
      <tbody>
            <tr>
                <td>แถวแรก</td>
            </tr>
            <tr>
                <td>แถวสุดท้าย</td>
            </tr>
      </tbody>
</table>

table.insertRow(row); ใช้สำหรับแทรกแถวลงในตาราง โดยสามารถกำหนดแถวที่ต้องการแทรกได้ (แถวแรกคือ 0) โดยระบุตัวเลขของแถว ค่าที่คืนกลับคือ แถวที่สร้าง (tr) 
tr.insertCell(col); ใช้สำหรับสร้างคอลัมน์ใหม่ โดยสามารถระบุลำดับคอลัมน์ได้ โดยที่คอลัมน์แรกคือ ลำดับ 0 เช่นกัน

ปล.ทั้ง 2 ฟังก์ชั่นสามารถสร้าง tr หรือ td ได้เลย โดยไม่ต้องใช้คำสั่ง appendChild ครับ