首頁猿問如何在JavaScript的HTM...

如何在JavaScript的HTML表格主體中插入行

JavaScript Html/CSS

繁花不似錦 2019-11-28 09:45:32

我有一個帶有頁眉和頁腳的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？

查看完整描述

3 回答

catspeake

TA貢獻1111條經驗獲得超0個贊

如果您想在中添加行tbody，請獲取對該行的引用并將其添加到其中。

var tableRef = document.getElementById('myTable').getElementsByTagName('tbody')[0];

// Insert a row in the table at the last row

var newRow = tableRef.insertRow();

// 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 此處查看文檔。

反對回復 2019-11-28

12345678_0001

TA貢獻1802條經驗獲得超5個贊

基本方法：

這應該添加HTML格式的內容并顯示新添加的行。

var myHtmlContent = "<h3>hello</h3>"

var tableRef = document.getElementById('myTable').getElementsByTagName('tbody')[0];

var newRow = tableRef.insertRow(tableRef.rows.length);

newRow.innerHTML = myHtmlContent;

反對回復 2019-11-28

寶慕林4294392

TA貢獻2021條經驗獲得超8個贊

添加行：

<html>

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>

</tr>

<tr>

</tr>

</table>

</body>

</html>

反對回復 2019-11-28

3 回答
0 關注
918 瀏覽

關注

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

如何在JavaScript的HTML表格主體中插入行

如何在JavaScript的HTML表格主體中插入行

3 回答

相關問題推薦

添加回答

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在JavaScript的HTML表格主體中插入行

如何在JavaScript的HTML表格主體中插入行

3 回答

相關問題推薦

添加回答