在表格的特定列中插入单元格

Question

我有一张桌子，上面放着3个剧集。

我正在尝试在第二列中插入单元格。

我将insertCell函数如下：

cell = row.insertCell(2); 

但这不起作用。

这是我的代码：

function add() {
    j++;
    count++;
    var table = document.getElementById('table0');
    var row = table.insertRow(-1);
    cell = row.insertCell(1);
    text = count;
    cell.appendChild(document.createTextNode(text));


}

这是我的JSFiddle 代码

谁能帮我？

Answer 1

传递给row.insertCell(index)必须小于或等于row.cells.length 。 在您的情况下，由于row是全新的行，因此row.cells.length为0 ，因此您必须传递0或-1 。

考虑表的HTML。 您如何在第二列中为包含单个单元格的行编写HTML？ 你做不到！ 如果第二列中有一个单元格，则第一列中也必须有一个单元格。

要在table创建新行，并在第二列中包含一个单元格：

var row = table.insertRow(-1);
var firstCell = row.insertCell(-1);
var secondCell = row.insertCell(-1);

为了使它在第一列中没有任何单元格的外观 ，请使用CSS去除边框和其他使其看起来像单元格的样式：

firstCell.className = "empty";

.empty {
    border: 0 none;
}

http://jsfiddle.net/54pmo8oy/14/

Answer 2

我尚不清楚这是否是您要尝试执行的操作，但希望它已经完成。 单击按钮将在每次单击时将新的单元格添加到第二列：

(function () {
    var count = 1,
        add = function () {
            var table = document.getElementById('table0'),
                row = table.rows[0],
                cell = row.insertCell(1),
                text = count;
            cell.innerHTML = text;
            count++;
        };
    document.getElementsByTagName('button')[0].addEventListener('click', function () {
        add();
    });
    add();
}());

JSFiddle