如何在JavaScript中插入HTML表格体中的行？
我有一个页眉和页脚的HTML表格：
<table id="myTable"> <thead> <tr> <th>My Header</th> </tr> </thead> <tbody> <tr> <td>aaaaa</td> </tr> </tbody> <tfoot> <tr> <td>My footer</td> </tr> <tfoot> </table> 我想用下面的方法在tbody添加一行：
myTable.insertRow(myTable.rows.length - 1);
但该行被添加到tfoot部分。
如何插入tbody ？
如果你想添加一行到tbody ，获取它的引用并将其添加到那里。
var tableRef = document.getElementById('myTable').getElementsByTagName('tbody')[0]; // Insert a row in the table at the last row var newRow = tableRef.insertRow(tableRef.rows.length); // Insert a cell in the row at index 0 var newCell = newRow.insertCell(0); // Append a text node to the cell var newText = document.createTextNode('New row'); newCell.appendChild(newText);
在这里工作的演示。 你也可以insertRow 这里查看insertRow的文档。
你可以试试这个使用JQuery。
$(table).find('tbody').append( "<tr><td>aaaa</td></tr>" );
你很近，只需将行添加到tbody而不是table ：
myTbody.insertRow();
在使用之前只需要参考tBody （ myTbody ）。 注意，你不需要传递表中的最后一个位置，当省略参数时它会自动定位在最后。
在jsFiddle现场演示 。
我试过这个，
这是为我工作
var table=document.getElementById("myTable"); var row=table.insertRow(myTable.rows.length-2); var cell1=row.insertCell(0);
我认为这个脚本就是你所需要的
var t = document.getElementById('myTable'); var r =document.createElement('TR'); t.tBodies[0].appendChild(r)
添加行
<html> <script> function addRow(){ var table = document.getElementById('myTable'); //var row = document.getElementById("myTable"); var x = table.insertRow(0); var e =table.rows.length-1; var l =table.rows[e].cells.length; //x.innerHTML = " "; for (var c =0, m=l; c < m; c++) { table.rows[0].insertCell(c); table.rows[0].cells[c].innerHTML = " "; } } function addColumn(){ var table = document.getElementById('myTable'); for (var r = 0, n = table.rows.length; r < n; r++) { table.rows[r].insertCell(0); table.rows[r].cells[0].innerHTML = " " ; } } function deleteRow() { document.getElementById("myTable").deleteRow(0); } function deleteColumn() { // var row = document.getElementById("myRow"); var table = document.getElementById('myTable'); for (var r = 0, n = table.rows.length; r < n; r++) { table.rows[r].deleteCell(0);//var table handle } } </script> <body> <input type="button" value="row +" onClick="addRow()" border=0 style='cursor:hand'> <input type="button" value="row -" onClick='deleteRow()' border=0 style='cursor:hand'> <input type="button" value="column +" onClick="addColumn()" border=0 style='cursor:hand'> <input type="button" value="column -" onClick='deleteColumn()' border=0 style='cursor:hand'> <table id='myTable' border=1 cellpadding=0 cellspacing=0> <tr id='myRow'> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table> </body> </html>
