tic-tac-toe（井字棋）游戏玩家回合提示不显示问题求助

核心问题原因 #

你的代码存在3处易引发异常的逻辑错误，共同导致回合提示无法正常更新：

1. 获胜判断的空值校验规则错误
2. DOM元素获取方式不统一存在兼容隐患
3. 换回合逻辑存在笔误（可选修正）

具体修复步骤 #

1. 修正获胜判断的空值校验 #

将checkWin函数中判断非空的条件boxtexts[e[0]].innerText !==" "（带空格的空字符串）改为boxtexts[e[0]].innerText !== ''（普通空字符串），和你初始化、赋值格子文本的逻辑保持一致，避免误判游戏状态。

2. 统一info元素的获取方式 #

把更新回合提示的代码：

document.getElementsByClassName("info")[0].innerText  = "Turn for " + turn;

改为和获胜提示相同的获取方式：

document.querySelector('.info').innerText = "Turn for " + turn;

避免getElementsByClassName动态集合的特性引发的DOM获取异常。

3. 修正换回合逻辑的笔误（可选） #

你的changeTurn函数中返回的是数字0的字符串"0"，如果是笔误想写井字棋常用的字母O，可以改为：

var changeTurn = ()=>{
    return  turn === "X"?"O":"X"
}

4. 可选优化（避免多余遍历） #

把checkWin中的forEach遍历改为for...of循环，匹配到获胜条件后直接终止遍历，提升运行效率：

const checkWin = ()=> {
    let boxtexts = document.getElementsByClassName('Btext');
    let wins = [
        [0, 1, 2],
        [3, 4, 5],
        [6, 7, 8],
        [0, 3, 6],
        [1, 4, 7],
        [2, 5, 8],
        [0, 4, 8],
        [2, 4, 6],
    ]
    for(let e of wins){
        if((boxtexts[e[0]].innerText === boxtexts[e[1]].innerText) && (boxtexts[e[1]].innerText === boxtexts[e[2]].innerText) && (boxtexts[e[0]].innerText !=='')){
            document.querySelector('.info').innerText = "player" + boxtexts[e[0]].innerText + "  WON";
            isGameover = true;
            break;
        }
    }
}

5. 样式异常排查（如果上述修改后仍不显示） #

如果修改逻辑后还是看不到回合提示，检查你的style.css中.info类的样式，添加如下规则避免内容被挤压隐藏：

.info {
    display: inline-block;
    white-space: nowrap;
    color: #000;
    margin-right: 12px;
}

内容的提问来源于stack exchange，提问作者antima99