如何使用javascript在具有多个表的树中找到td单元格的最大值

Question

我想使用javascript从具有多个表的树中找出td单元格的最大长度。

对于下面的例子，它应该返回9

<div>
<p>First table</p>
<table>
<tr>
<td>First</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>second</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>the</td>
<td>third</td>
<td>one</td>
</tr>
</table>
</div>
<p>Second table</p>
<table>
<tr>
<td>t</td>
<td>t1</td>
</tr>
<tr>
<td>td3</td>
<td>td4</td>
</tr>
</table>

下面是我的代码，

function solution() {
const tables = document.getElementsByTagName('table');
const count = 
Array.from(tables, table => table.getElementsByTagName('td').length);
return count.length > 0 ? Math.max(...count) : 0;
}   

我已经从这里使用了Array.，并且我想要传递一个函数，而不是写入table=>table.getElementsByTagName。有人能帮我做这个吗。谢谢

Answer 1

const getTdTableLength = (table) => table.getElementsByTagName('td').length;
const getMaxCount = (count) => Math.max(...count);
const tables = document.getElementsByTagName('table');
const countsArray = Array.from(tables, getTdTableLength);
console.log(getMaxCount(countsArray));

<div>
<p>First table</p>
<table>
<tr>
<td>First</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>second</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>the</td>
<td>third</td>
<td>one</td>
</tr>
</table>
</div>
<p>Second table</p>
<table>
<tr>
<td>t</td>
<td>t1</td>
</tr>
<tr>
<td>td3</td>
<td>td4</td>
</tr>
</table>

Answer 2

var tds = [];
[...document.querySelectorAll("table")].forEach(table => {
tds.push(table.querySelectorAll("td").length)  
});
console.log(tds)
console.log(Math.max(...tds))

<table>
<tr>
<td>First</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>second</td>
<td>row</td>
</tr>
<tr>
<td>and</td>
<td>the</td>
<td>third</td>
<td>one</td>
</tr>
</table>

<table>
<tr>
<td>t</td>
<td>t1</td>
</tr>
<tr>
<td>td3</td>
<td>td4</td>
</tr>
</table>

Answer 3

let tds = 0,
tables = document.querySelectorAll(".table");
tables.forEach(table => {
let table_tds = table.querySelectorAll("td").length;
if(tds < table_tds) tds = table_tds;
});
console.log(tds)