在不使用jQuery的情况下将表转换为JavaScript中的数组

Question

我需要根据表中的内容将我创建的表格转换为多维数组.数组的格式如下:

 var array = [
               [column,column,...],
               [column,column,...],
               ...
              ];

如何在不使用jQuery的情况下使用纯JavaScript进行此操作？我找到的所有答案都在jQuery中.

JSFiddle.

Answer 1

使用qSA并且Array.prototype.map非常简单.

var tableInfo = Array.prototype.map.call(document.querySelectorAll('#tableId tr'), function(tr){
  return Array.prototype.map.call(tr.querySelectorAll('td'), function(td){
    return td.innerHTML;
    });
  });

Answer 2

假设您的表格类似于下面的表格，您可以使用表格的行集合和行的单元格集合将其转换为数组数组：

function tableToArray(table) {
  var result = []
  var rows = table.rows;
  var cells, t;

  // Iterate over rows
  for (var i=0, iLen=rows.length; i<iLen; i++) {
    cells = rows[i].cells;
    t = [];

    // Iterate over cells
    for (var j=0, jLen=cells.length; j<jLen; j++) {
      t.push(cells[j].textContent);
    }
    result.push(t);
  }
  return result; 
}
    
    document.write(JSON.stringify(tableToArray(document.getElementsByTagName('table')[0])));

<table>
  <tr>
    <td>one<td>two<td>three
  <tr>
    <td>one<td>two<td>three
  <tr>
    <td>one<td>two<td>three
</table>

或者，如果喜欢简洁的代码，请使用一些 ES5 优点：

function tableToArray(table) {
  var result  = [].reduce.call(table.rows, function (result, row) {
      result.push([].reduce.call(row.cells, function(res, cell) {
          res.push(cell.textContent);
          return res;
      }, []));
      return result;
  }, []);
  return result;
}