js版贪吃蛇
作者: 郑晓 分类: javacript 发布于: 2016-10-27 19:00 浏览:6,555 评论(10)
参考网上某代码写的js版贪吃蛇,贪吃蛇整个过程分为三部分,地图的生成、食物的随机显示,蛇的显示和移动。运行时按键盘上下左右进行方向控制,蛇头撞到边界或自己时游戏结束。目前已知的问题为:生成食物时未排除生成到蛇身上的可能。
(function() {
var t = null;
var map = null;
var food={x:0,y:0,div:null};
var snake={
//初始化时的蛇身部分
snakeBody : [[1,2,null], [2,2,null], [3,2,null], [4,2,null]],
direct : "right"
};
var config = {
width:200,
height:200,
px:10, //单位块大小
mapColor:"#dddddd",
foodColor:"#555555",
snakeColor:"#666666",
position:'absolute',
speed:100
};
var showMap = function() {
var div = document.createElement("div");
div.style.width = config.width + "px";
div.style.height= config.height + "px";
div.style.backgroundColor = config.mapColor;
div.style.position = config.position;
document.getElementsByTagName("body")[0].appendChild(div);
map = div;
};
var showFood = function() {
var x = Math.floor(Math.random()*config.width/config.px);
var y = Math.floor(Math.random()*config.height/config.px);
food.x = x;
food.y = y;
if(food.div == null) {
var div = document.createElement("div");
div.style.width = config.px + "px";
div.style.height= config.px + "px";
div.style.backgroundColor = config.foodColor;
div.style.position = config.position;
div.style.left = x * config.px + "px";
div.style.top = y * config.px + "px";
map.appendChild(div);
food.div = div;
} else {
food.div.style.left = x * config.px + "px";
food.div.style.top = y * config.px + "px";
}
};
var showSnake = function() {
for(var i=0;i
运行截图:
本文采用知识共享署名-非商业性使用 3.0 中国大陆许可协议进行许可,转载时请注明出处及相应链接。
本文永久链接: https://www.zh30.com/js-snake.html
js版贪吃蛇:目前有10 条留言
有点意思,我刚好路过
挺好的
厉害了!
Nightsong.cc 晚歌的个人博客
挺好的,祝你快乐
这个不错。
我只是来随便看看!
第三方
三天不来手痒痒!
相当不错,自愧不如!