Javascript 如何识别和突出显示可用于入住检查的位置

我正在用js创建一个跳棋游戏。我有一个8x8数组，其中0对应一个空单元格，1对应一个白色棋盘格，2对应一个黑色棋盘格。在这个数组中循环，我创建了一个游戏板和一个棋盘格，并分配了一个id。当你点击棋盘格时，它应该高亮显示，你可以行走的可用空闲位置也应该高亮显示。我如何写它只能对角线移动，并检查单元是否自由，以及如何确定不应跨越的电路板边界

const board = [2, 0, 2, 0, 2, 0, 2, 0,
             0, 2, 0, 2, 0, 2, 0, 2,
             2, 0, 2, 0, 2, 0, 2, 0,
             0, 0, 0, 0, 0, 0, 0, 0,
             0, 0, 0, 0, 0, 0, 0, 0,
             0, 1, 0, 1, 0, 1, 0, 1,
             1, 0, 1, 0, 1, 0, 1, 0,
             0, 1, 0, 1, 0, 1, 0, 1]

let tbody = document.querySelector('#table').appendChild(document.createElement('tbody'))
function createBoard() {
    for(let i = 0; i < 8; i++) { 
        let tr = tbody.appendChild(document.createElement('tr'));     
        for(let j = 0; j < 8; j++) {
            let td = tr.appendChild(document.createElement("td"));
            td.id = board[j + i * 8];
            if(td.id === '1') {
                let p = td.appendChild(document.createElement("p"));
                p.classList.add('white-checker');
            }
            if(td.id === '2') {
                let p = td.appendChild(document.createElement("p"));
                p.classList.add('black-checker');
            }
        }
    }
};
createBoard();
let cell = document.querySelectorAll('td');
cell.forEach((item, i) => {item.addEventListener('click', () => { 
    if(item.id === '1') {
        item.classList.toggle('choose');
        ?
    }
})})

const board=[2,0,2,0,2,0,2,0，
0, 2, 0, 2, 0, 2, 0, 2,
2, 0, 2, 0, 2, 0, 2, 0,
0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0, 0, 0,
0, 1, 0, 1, 0, 1, 0, 1,
1, 0, 1, 0, 1, 0, 1, 0,
0, 1, 0, 1, 0, 1, 0, 1]
让tbody=document.querySelector（'#table'）.appendChild（document.createElement（'tbody'））
函数createBoard（）{
对于（设i=0；i<8；i++）{
让tr=tbody.appendChild（document.createElement（'tr'）；
for（设j=0；j<8；j++）{
设td=tr.appendChild（document.createElement（“td”）；
td.id=板[j+i*8]；
如果（td.id=='1'）{
设p=td.appendChild（document.createElement（“p”））；
p、 添加（'white-checker'）；
}
如果（td.id=='2'）{
设p=td.appendChild（document.createElement（“p”））；
p、 添加（'black-checker'）；
}
}
}
};
createBoard（）；
let cell=document.querySelectorAll（'td'）；
cell.forEach（（item，i）=>{item.addEventListener（'click'，（）=>{
如果（item.id=='1'）{
item.classList.toggle（'choose'）；
?
}
})})