使用JavaScript为二维数组着色可以通过以下步骤实现:
var grid = [
[1, 0, 1],
[0, 1, 0],
[1, 1, 0]
];
colorGrid
的函数:function colorGrid(grid) {
var colors = ['red', 'blue', 'green']; // 定义颜色数组,可以根据需要自定义颜色
var rows = grid.length;
var cols = grid[0].length;
for (var i = 0; i < rows; i++) {
for (var j = 0; j < cols; j++) {
var cell = document.getElementById('cell-' + i + '-' + j); // 假设每个网格单元格都有一个唯一的ID,例如cell-0-0表示第一行第一列的单元格
var colorIndex = grid[i][j]; // 获取当前网格单元格的值作为颜色索引
cell.style.backgroundColor = colors[colorIndex]; // 根据颜色索引设置背景颜色
}
}
}
gridTable
的表格:<table id="gridTable">
<tr>
<td id="cell-0-0"></td>
<td id="cell-0-1"></td>
<td id="cell-0-2"></td>
</tr>
<tr>
<td id="cell-1-0"></td>
<td id="cell-1-1"></td>
<td id="cell-1-2"></td>
</tr>
<tr>
<td id="cell-2-0"></td>
<td id="cell-2-1"></td>
<td id="cell-2-2"></td>
</tr>
</table>
colorGrid
函数,并传入网格数组作为参数,即可为每个网格单元格着色:colorGrid(grid);
这样,根据二维数组的值,每个网格单元格将被着上对应的颜色。
注意:以上代码仅为示例,实际应用中需要根据具体情况进行适当修改和调整。
领取专属 10元无门槛券
手把手带您无忧上云