记忆游戏：Uncaught TypeError报错及点击计数移除checked类问题求助

嘿，我来帮你搞定这个Uncaught TypeError: Cannot read property 'remove' of undefined的报错问题！咱们一步步拆解问题：

错误原因分析 #

你的代码里有两个关键问题导致了报错：

1. CSS选择器错误：
   你写的.fa fa-star.checked是后代选择器，会去找所有带.fa类元素下的带fa-star.checked类的元素，但实际上fa和fa-star是同一个星星元素上的两个类，正确的选择器应该是.fa.fa-star.checked（类名之间用点连接，没有空格）。
2. 直接操作NodeList集合：
   document.querySelectorAll()返回的是一个NodeList（元素集合），不是单个DOM元素，所以你不能直接调用stars.classList.remove()，必须遍历集合里的每个元素来操作。
3. 另外你提到希望点击次数等于2时移除类，所以要把条件movecount == 12改成movecount == 2。

修正后的代码 #

function countmoves(){ 
    movecount++; //点击次数递增
    moveNumber.innerHTML = movecount <= 1 ? movecount+" " + "Move" : movecount +" "+ "Moves"; 
    if (movecount == 2){ // 改成你需要的点击次数2
        // 修正选择器，获取所有带checked类的星星元素
        let stars = document.querySelectorAll('.fa.fa-star.checked'); 
        // 遍历每个星星元素，移除checked类
        stars.forEach(star => {
            star.classList.remove("checked");
        });
    } 
}

额外优化建议 #

如果只需要移除一颗星星的checked类（比如从3星降到2星），可以用querySelector()（只返回第一个匹配的元素）代替querySelectorAll()，这样更高效：

if (movecount == 2){
    let star = document.querySelector('.fa.fa-star.checked:last-child'); // 移除最后一颗星星的选中状态
    if(star){ // 先判断元素是否存在，避免报错
        star.classList.remove("checked");
    }
}

这样改完后，点击次数到2时就能正常移除星级的checked类，不会再触发报错啦！

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