编程猫简单小游戏

编程猫是一款特别适合初学者的编程学习平台，其提供了丰富的小游戏来帮助学生巩固所学的知识。下面是一个编程猫小游戏代码的例子，供你参考。

```javascript

// 定义一个动画函数，让图片能够运动

function animate(obj, target, callback) {

clearInterval(obj.timer);

obj.timer = setInterval(function () {

var current = parseInt(getComputedStyle(obj, null)["left"]);

var step = (target current) / 10;

step = step > 0 ? Math.ceil(step) : Math.floor(step);

obj.style.left = current step "px";

if (current == target) {

clearInterval(obj.timer);

callback && callback();

}

}, 15)

}

// 获取需要操作的DOM元素

var cat = document.querySelector(".cat");

var mouse = document.querySelector(".mouse");

var score = document.querySelector(".score");

// 定义一些变量来记录游戏状态

var isStarted = false; // 游戏是否已启动

var catScore = 0; // 猫的得分

var mouseScore = 0; //老鼠的得分

// 点击开始游戏按钮，游戏开始

document.querySelector(".startbtn").addEventListener("click", function () {

if (!isStarted) {

animate(cat, window.innerWidth cat.clientWidth 20, function () {

animate(cat, cat.clientWidth, function () {

isStarted = false;

})

});

isStarted = true;

}

})

// 点击猫，猫得分

cat.addEventListener("click", function () {

if (isStarted) {

catScore ;

score.innerHTML = "猫:" catScore "
老鼠:" mouseScore;

}

})

// 点击老鼠，老鼠得分

mouse.addEventListener("click", function () {

if (isStarted) {

mouseScore ;

score.innerHTML = "猫:" catScore "
老鼠:" mouseScore;

this.style.display = "none";

}

})

```

以上代码展示了一个简单的编程猫小游戏：猫和老鼠的追逐比赛。玩家通过点击“开始游戏”按钮启动游戏，在猫和老鼠出现后，点击猫或老鼠来得分。当其中一个角色突出屏幕，游戏结束。代码通过JavaScript编写，包含了DOM操作、事件监听、元素动画等知识点。