html5实现贪吃蛇源代码

《html5实现贪吃蛇源代码》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、#myCanvas{border:1pxsolid#f00;}<

2、scripttype="text/javascript">varcanvas=document.getElementById("myCanvas");varctx=canvas.getContext("2d");varw=15;//格子宽、高varsnaLen=6;//初始长度varsnake=[];//身体长度for(vari=0;i

3、andom()*28+1);varfoody=Math.ceil(Math.random()*28+1);varfood=newFood(foodx,foody);//食物functionFood(x,y){this.x=x;this.y=y;returnthis;}//身体functioncell(x,y,d){this.x=x;this.y=y;this.d=d;returnthis;}//动作functiondraw(){ctx.clearRect(0,0,450,450);//画布局//for(vari=0;i<30;i

4、++){//ctx.strokeStyle="#ccc";//线条颜色//ctx.beginPath();//ctx.moveTo(0,i*w);//ctx.lineTo(450,i*w);//ctx.moveTo(i*w,0);//ctx.lineTo(i*w,450);//ctx.closePath();//ctx.stroke();//}//画蛇身for(varj=0;j

5、"red";}ctx.beginPath();ctx.rect(snake[j].x*w,snake[j].y*w,w,w);ctx.closePath();ctx.fill();ctx.stroke();}//出现食物drawFood();//吃到食物if(head.x==food.x&&head.y==food.y){initFood();food=newFood(foodx,foody);//重新出现食物drawFood();//增加蛇的长度有些小瑕疵，蛇身增长时应该是身体增长，而不是在蛇头上增长varnewCell=ne

6、wcell(head.x,head.y,head.d);switch(head.d){case40:newCell.y++;break;//下case39:newCell.x++;break;//右case38:newCell.y--;break;//上case37:newCell.x--;break;//左}snake[snake.length]=newCell;head=newCell;//head=}}//随机初始化食物functioninitFood(){foodx=Math.ceil(Math.random()*28+

7、1);foody=Math.ceil(Math.random()*28+1);for(vari=0;i

8、document.onkeydown=function(e){//下40，右边39，左边37，上38键盘事件varkeyCode=e.keyCode;if(head.d-keyCode!=2&&head.d-keyCode!=-2&&keyCode>=37&&k