Question

我正在动态地向表中添加新行，使用以下代码：

tbody = document.getElementById('tbody');
tr = tbody.insertRow(-1);
tr.id = 'last';
th = tr.insertCell(0);
td = tr.insertCell(1);

但实际上我得到的是两个td个细胞。我想要一个th，你可以看到。

它表示tagName属性不可更改。

我该怎么做？

我是否需要使用{常规'方法，例如createElement和appendChild？

Answer 1

我没有看到任何允许你这样做的官方文档。

W3C Documentation for TR / TR.insertCell

createElement/appendChild可以使用。

Answer 2

我所做的是先定义th，例如TableHeaderRow thr = new TableHeaderRow（）; 添加单元格，然后将其添加到表格中。

Answer 3

我知道它是这样工作的：

var table = d3.select("#table");
    table.html("");
    head = table.append("tr");
    head.append("th").text("column_header_1");
    head.append("th").text("column_header_2");

    chartData.forEach(function (obj) {
        row = table.append("tr");
        row.append("td").text(obj.datapoint_1);
        row.append("td").text(obj.datapoint_2);

Answer 4

一种快速而有效的方法是在innerHtml中使用<b></b>标签

tbody = document.getElementById('tbody');
tr = tbody.insertRow(-1);
tr.id = 'last';
td = tr.insertCell(1);
th = tr.insertCell(0);
th.innerHtml = '<b>th cell1</b>
th = tr.insertCell(1);
th.innerHtml = '<b>th cell2</b>
//and so on

是否可以使用TableRow.insertCell（）创建TH？

4 个答案: