js数组计算重组成表格行列格式数据方法

10 篇文章 0 订阅

在很多开发中会遇到一个一维数组,需要变为具有行和列的数据格式,比如一个数组有10个元素,需要变为多行,每行2列数组的格式,在前端开发中也有很多应用场景,以下将展示为实现这种功能的演示。

假设数组:

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

需要根据动态列进行表格数据化,结果这里把它装在一个新的数组

方法一:抽取式

这种方式比较简单,在遍历数组的时候装入row(行数组),在每次遍历时检查行的元素长度是否到达col(预设列)长度,如果达到,把它放入nList(大数组),row并清空(等待下次再装入新元素),就像叉车从大货车卸货一样,装一堆(col个数量)为一次,来回一共row次。

function listToTableData(list, col) {
	let nList = [], row = []
	list.forEach((n,i)=>{
	  row.push(n)
	  if (row.length === col||list.length-1===i) {
		nList.push(row)
		row = []
	  }
	})
	return nList
}
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(`data is ${JSON.stringify(listToTableData(arr, 3))}`)
// 测试打印结果为 [[1,2,3],[4,5,6],[7,8,9],[10]]

 

要使用JavaScript进行数组循环并取得表格某列的数据,可以按照以下步骤进行: 1. 首先,使用JavaScript获取到表格的DOM元素,可以使用getElementById()或querySelector()方法来获取表格的元素。 2. 然后,使用JavaScript获取表格的行数和列数,可以通过表格的rows和cells属性来获取。 3. 创建一个空数组来存储取出的列数据。 4. 使用for循环遍历表格的每一行,从第二行开始循环,因为第一行通常是表头。 5. 在循环体内,通过cells属性获取到当前行的指定列的单元格数据,可以使用索引来指定列。将取到的数据添加到之前创建的数组中。 6. 循环结束后,得到的数组就是所需的表格某列的数据。 以下是一个具体的示例代码: ```javascript // 获取表格元素 var table = document.getElementById("myTable"); // 获取表格行数和列数 var rowCount = table.rows.length; var columnCount = table.rows[0].cells.length; // 创建数组来存储取出的列数据 var columnData = []; // 循环行 for (var i = 1; i < rowCount; i++) { // 获取指定列的单元格数据 var cellData = table.rows[i].cells[1].innerHTML; // 将数据添加到数组中 columnData.push(cellData); } // 输出结果 console.log(columnData); ``` 以上代码假设表格的id为"myTable",要取得第二列的数据。根据实际情况,你可以根据表格的id来修改代码中的"myTable",并根据需要的列数来修改代码中的索引值。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值