计算表格行中的列数

Question

我有一张类似于的表:

<table id="table1">
<tr>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
</tr>
<tr>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
  <td><input type="text" value="" /></td>
</tr>
<table>

我想连续计算td元素的数量.我在尝试:

document.getElementById('').cells.length;
document.getElementById('').length;
document.getElementById('').getElementsByTagName('td').length;

它没有显示实际结果.

Answer 1

document.getElementById('table1').rows[0].cells.length

cell不是表的属性,行是.但是,单元格是一行的属性

Answer 2

你可以做

alert(document.getElementById('table1').rows[0].cells.length)

在这里小提琴http://jsfiddle.net/TEZ73/

Answer 3

为什么不使用reduce以便我们可以考虑colspan呢？:)

function getColumns(table) {
    var cellsArray = [];
    var cells = table.rows[0].cells;

    // Cast the cells to an array
    // (there are *cooler* ways of doing this, but this is the fastest by far)
    // Taken from /sf/answers/1060098861/
    for(var i=-1, l=cells.length; ++i!==l; cellsArray[i]=cells[i]);

    return cellsArray.reduce(
        (cols, cell) =>
            // Check if the cell is visible and add it / ignore it
            (cell.offsetParent !== null) ? cols += cell.colSpan : cols,
        0
    );
}