console
/**
* 可用函数列表
*
******************************************
* 获取指定单元格的当前的数字
*
* @row 行号
* @col 列号
* function getCellValue(row, col)
******************************************
*
******************************************
* 设置指定单元格的数字
*
* @row 行号
* @col 列号
* @value 待设置的数值
* function setCellValue(row, col, value)
******************************************
*
******************************************
* 恢复指定单元格到初始状态
*
* function resetCell()
******************************************
*
******************************************
* 获取指定单元格曾用过的数字数组
*
* @row 行号
* @col 列号
* function getCellHistoryNumbers(row, col)
*****************************************
*
*****************************************
* 从一个数字数组中随机挑选一个数字
*
* @numbers 数字数组
* function pickNumber(numbers)
****************************************
*/
/**
* 获取指定单元格当前可以使用的数字
*/
function getCellAvailableNumbers(row, col) {
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 过滤掉所有不能使用的数字后再返回
return numbers;
}
/**
* 点击 '生成终盘' 按钮时被执行
*/
function setBoard() {
for(i=0;i<9;i++){
setCellValue(1,i,i)
console.log(getCellValue(1,i))
}
}
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://static.5icoding.cn/sudoku.js"></script>
<link rel="stylesheet" type="text/css" href="https://static.5icoding.cn/sudoku.css">
</head>
<body>
<div class='flex-c'>
<div class='title'>蔻叮 - 终盘练习 02</div>
<div id='board'>
<table>
<tr>
<td class='col-num'></td>
<td class='col-num'>1</td>
<td class='col-num'>2</td>
<td class='col-num'>3</td>
<td class='col-num'>4</td>
<td class='col-num'>5</td>
<td class='col-num'>6</td>
<td class='col-num'>7</td>
<td class='col-num'>8</td>
<td class='col-num'>9</td>
</tr>
<tr>
<td class='col-num'>1</td>
<td class='hole'><input id='00' /></td>
<td class='hole'><input id='01' /></td>
<td class='hole'><input id='02' /></td>
<td class='hole'><input id='03' /></td>
<td class='hole'><input id='04' /></td>
<td class='hole'><input id='05' /></td>
<td class='hole'><input id='06' /></td>
<td class='hole'><input id='07' /></td>
<td class='hole'><input id='08' /></td>
<td class='col-num'>1</td>
</tr>
<tr>
<td class='col-num'>2</td>
<td class='hole'><input id='10' /></td>
<td class='hole'><input id='11' /></td>
<td class='hole'><input id='12' /></td>
<td class='hole'><input id='13' /></td>
<td class='hole'><input id='14' /></td>
<td class='hole'><input id='15' /></td>
<td class='hole'><input id='16' /></td>
<td class='hole'><input id='17' /></td>
<td class='hole'><input id='18' /></td>
<td class='col-num'>2</td>
</tr>
<tr>
<td class='col-num'>3</td>
<td class='hole'><input id='20' /></td>
<td class='hole'><input id='21' /></td>
<td class='hole'><input id='22' /></td>
<td class='hole'><input id='23' /></td>
<td class='hole'><input id='24' /></td>
<td class='hole'><input id='25' /></td>
<td class='hole'><input id='26' /></td>
<td class='hole'><input id='27' /></td>
<td class='hole'><input id='28' /></td>
<td class='col-num'>3</td>
</tr>
<tr>
<td class='col-num'>4</td>
<td class='hole'><input id='30' /></td>
<td class='hole'><input id='31' /></td>
<td class='hole'><input id='32' /></td>
<td class='hole'><input id='33' /></td>
<td class='hole'><input id='34' /></td>
<td class='hole'><input id='35' /></td>
<td class='hole'><input id='36' /></td>
<td class='hole'><input id='37' /></td>
<td class='hole'><input id='38' /></td>
<td class='col-num'>4</td>
</tr>
<tr>
<td class='col-num'>5</td>
<td class='hole'><input id='40' /></td>
<td class='hole'><input id='41' /></td>
<td class='hole'><input id='42' /></td>
<td class='hole'><input id='43' /></td>
<td class='hole'><input id='44' /></td>
<td class='hole'><input id='45' /></td>
<td class='hole'><input id='46' /></td>
<td class='hole'><input id='47' /></td>
<td class='hole'><input id='48' /></td>
<td class='col-num'>5</td>
</tr>
<tr>
<td class='col-num'>6</td>
<td class='hole'><input id='50' /></td>
<td class='hole'><input id='51' /></td>
<td class='hole'><input id='52' /></td>
<td class='hole'><input id='53' /></td>
<td class='hole'><input id='54' /></td>
<td class='hole'><input id='55' /></td>
<td class='hole'><input id='56' /></td>
<td class='hole'><input id='57' /></td>
<td class='hole'><input id='58' /></td>
<td class='col-num'>6</td>
</tr>
<tr>
<td class='col-num'>7</td>
<td class='hole'><input id='60' /></td>
<td class='hole'><input id='61' /></td>
<td class='hole'><input id='62' /></td>
<td class='hole'><input id='63' /></td>
<td class='hole'><input id='64' /></td>
<td class='hole'><input id='65' /></td>
<td class='hole'><input id='66' /></td>
<td class='hole'><input id='67' /></td>
<td class='hole'><input id='68' /></td>
<td class='col-num'>7</td>
</tr>
<tr>
<td class='col-num'>8</td>
<td class='hole'><input id='70' /></td>
<td class='hole'><input id='71' /></td>
<td class='hole'><input id='72' /></td>
<td class='hole'><input id='73' /></td>
<td class='hole'><input id='74' /></td>
<td class='hole'><input id='75' /></td>
<td class='hole'><input id='76' /></td>
<td class='hole'><input id='77' /></td>
<td class='hole'><input id='78' /></td>
<td class='col-num'>8</td>
</tr>
<tr>
<td class='col-num'>9</td>
<td class='hole'><input id='80' /></td>
<td class='hole'><input id='81' /></td>
<td class='hole'><input id='82' /></td>
<td class='hole'><input id='83' /></td>
<td class='hole'><input id='84' /></td>
<td class='hole'><input id='85' /></td>
<td class='hole'><input id='86' /></td>
<td class='hole'><input id='87' /></td>
<td class='hole'><input id='88' /></td>
<td class='col-num'>9</td>
</tr>
<tr>
<td class='col-num'></td>
<td class='col-num'>1</td>
<td class='col-num'>2</td>
<td class='col-num'>3</td>
<td class='col-num'>4</td>
<td class='col-num'>5</td>
<td class='col-num'>6</td>
<td class='col-num'>7</td>
<td class='col-num'>8</td>
<td class='col-num'>9</td>
</tr>
</table>
</div>
<div class='action-panel flex'>
<div class='button' onClick='handleClick();'>生成终盘</div>
<script>
function handleClick() {
resetBoard();
setBoard();
}
</script>
</div>
</div>
</body>
</html>