在不使用 jQuery 的情况下在 JavaScript 中将表转换为数组
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/34349403/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Convert table to array in JavaScript without using jQuery
提问by Pratish Shrestha
I need to convert the table grid i created into an multidimensional array according to the content inside the table. Array would be in format like:
我需要根据表格内部的内容将我创建的表格网格转换为多维数组。数组的格式如下:
var array = [
[column,column,...],
[column,column,...],
...
];
How do I do this without using jQuery, using plain JavaScript? All answers I found was in jQuery.
如何在不使用 jQuery 的情况下使用纯 JavaScript 执行此操作?我找到的所有答案都在 jQuery 中。
回答by MinusFour
With qSA and Array.prototype.map
is pretty simple.
使用 qSAArray.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;
});
});
回答by RobG
Presuming your table is something like the one below, you can convert that into an array of arrays using the rowscollection of the table and cellscollection of the rows:
假设您的表格类似于下面的表格,您可以使用表格的行集合和行的单元格集合将其转换为数组数组:
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>
Or if like concise code, use some ES5 goodness:
或者,如果喜欢简洁的代码,请使用一些 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;
}
回答by gurvinder372
you can get all the tr
inside a table
(having id table1
) by doing
你可以通过做得到所有的tr
内部table
(有 id table1
)
var tableObj = document.getElementById( "table1" );
var arr = [];
var allTRs = tableObj.getElementsByTagName( "tr" );
for ( var trCounter = 0; trCounter < allTRs.length; trCounter++ )
{
var tmpArr = [];
var allTDsInTR = allTRs[ trCounter ].getElementsByTagName( "td" );
for ( var tdCounter = 0; tdCounter < allTDsInTR.length; tdCounter++ )
{
tmpArr.push( allTDsInTR[ tdCounter ].innerHTML );
}
arr.push( tmpArr );
}
console.log( arr );
回答by Micha? Per?akowski
Run a for loop through the rows and the fields:
通过行和字段运行 for 循环:
var array = [];
var table = document.querySelector("table tbody");
var rows = table.children;
for (var i = 0; i < rows.length; i++) {
var fields = rows[i].children;
var rowArray = [];
for (var j = 0; j < fields.length; j++) {
rowArray.push(fields[j].innerHTML);
}
array.push(rowArray);
}
console.log(array);