如何在Javascript中插入HTML表体中的行?

I have an HTML table with a header and a footer:

我有一个带有页眉和页脚的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>

I am trying to add a row in tbody with the following:

我试图在tbody中添加一行如下:

myTable.insertRow(myTable.rows.length - 1);

but the row is added in the tfoot section.

但是在tfoot部分添加了行。

How to insert it tbody?

如何插入它的tbody?

8 个解决方案

#1

125

If you want to add a row into the tbody, get a reference to it and add it there.

如果您想要将一行添加到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);

A working demo here. Also you can check the documentation of insertRow here.

一个工作演示。您还可以在这里查看insertRow的文档。

8 个解决方案

#1

更多相关文章

随机推荐