排列中的每5個項目，而不是JavaScript中的每個第5個項目

Question

我有一個由多行組成的表。每行包含5個數據單元，並且每個單元的innerHTML是不同的：

HTML

<tr> 
    <td>Data 1</td> 
    <td>Data 2</td> 
    <td>Data 3</td> 
    <td>Data 4</td> 
    <td>Data 5</td> 
</tr> 
<tr> 
    <td>Data 6</td> 
    <td>Data 7</td> 
    <td>Data 8</td> 
    <td>Data 9</td> 
    <td>Data 10</td> 
</tr> 
... 

的JavaScript

在下面的代碼從所述第一5個細胞得到的數據，但我需要循環遍歷所有行，然後遍歷每行內的每個單元格。

var allTableData = []; 
var tableData = $('td'); 

_.each(tableData, (data, i) => { 
    if (i < 5) { 
     allTableData.push(data.innerHTML); 
    } 
}); 

我所需的輸出是：

values: [ 
    ['Data 1', 'Data 2', 'Data 3', 'Data 4', 'Data 5'], 
    ['Data 6', 'Data 7', 'Data 8', 'Data 9', 'Data 10'], 
    [...] 
]; 

如何我會得到我想要的輸出用JavaScript/JQuery的？

Answer 1

我會做的.map()兩個層次：

var arr = $('table tr').get().map(function(tr) { 
    return $('td', tr).get().map(function(td) { 
    return $(td).html(); 
    }); 
}); 

https://jsfiddle.net/gbgjhj83/

Answer 2

您需要遍歷tr S，以及循環中，遍歷td秒。

var allTableData = []; 
 
var rowData = []; 
 
var tableRows = $('#myTable tr'); 
 
var row; 
 

 
tableRows.each(function() { 
 
    rowCells = $(this).find('td'); 
 
    rowCells.each(function() { 
 
    rowData.push($(this).text()); 
 
    }); 
 
    allTableData.push(_.clone(rowData)); 
 
    rowData.length = 0; 
 
}); 
 

 
console.log(allTableData);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.6/lodash.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<table id="myTable"> 
 
    <tr> 
 
    <td>Data 1</td> 
 
    <td>Data 2</td> 
 
    <td>Data 3</td> 
 
    <td>Data 4</td> 
 
    <td>Data 5</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Data 6</td> 
 
    <td>Data 7</td> 
 
    <td>Data 8</td> 
 
    <td>Data 9</td> 
 
    <td>Data 10</td> 
 
    </tr> 
 
</table>

https://jsfiddle.net/Lzekdy23/2/