【蓝桥杯】小兔子找胡萝卜

最新推荐文章于 2025-04-29 22:36:24 发布

万花镜whj

最新推荐文章于 2025-04-29 22:36:24 发布

阅读量489

点赞数 5

文章标签：蓝桥杯

本文链接：https://blog.csdn.net/weixin_62613460/article/details/139200156

版权

仅作记录之用

// TODO：游戏开始
let startBtn = document.querySelector("#start");
let resetBtn = document.querySelector("#reset");
let moveBtn = document.querySelector("#move");
let map = document.querySelectorAll(".lawn");
let step = document.querySelector(".process input");
let res = document.querySelector(".result");
let posi = 0;
function start() {
  startBtn.style.display = "none";
  moveBtn.style.display = "block";
}
// TODO：重置游戏
function reset() {
  map[0].classList.add("active");
  map[posi].classList.remove("active");
  posi = 0;
  step.value = "";
  res.innerHTML = "";
  resetBtn.style.display = "none";
  startBtn.style.display = "block";  //点击重置后是开始按钮
}
// TODO：移动
function move() {
  console.log(map[1].classList, posi);
  if (step.value && (step.value == 1 || step.value == 2)) {
    map[posi].classList.remove("active");
    if (posi == 22) {
      posi += 1; //防止跳出格，不知道有无此要求
    } else {
      posi += step.value == 1 ? 1 : 2;
    }
    map[posi].classList.add("active");
    res.innerHTML = "";
    if (posi == 12) {
      moveBtn.style.display = "none";
      resetBtn.style.display = "block";
      res.innerHTML = "哎呀！兔子踩到炸弹了，游戏结束！";
    } else if (posi == 23) {
      moveBtn.style.display = "none";
      resetBtn.style.display = "block";
      res.innerHTML = "小兔子吃到胡萝卜啦，游戏获胜！";
    }
  } else {
    res.innerHTML = "输入的步数不正确，请重新输入。";
  }
}