HTML实现贪吃蛇
<!doctype html><html><head></head><body>
<div id="box" style="width:256px;font:25px/25px 宋體;background:#000;color:#9f9;"></div><script>
var arr=[15];
var next=10;//最好判斷一下arr[1]!=arr[0]+x
document.onkeydown=function(e){next={'37':-1,'39':1,'38':-10,'40':10}[(e?e:event).keyCode]};
var run=setInterval(function(){var list=['-1&&arr[0]%10==0','1&&arr[0]%10==9','-10&&arr[0]<10','10&&arr[0]>189'];var temp=arr[0]+next;if(list.some(function(x){return eval('next=='+x)})||arr.indexOf(temp)>=0)return clearInterval(run)||alert('OVER');arr.unshift(temp);if(this.food==null||food==temp){list=[];//(list=Array(200)).forEach(function(val,i){list[i]=i});for(var i=0;i<200;i++)list.push(i);list=list.filter(function(x){return arr.indexOf(x)<0});food=list[Math.round(Math.random()*(list.length-1))];//food是全局變量}elsearr.pop();var s='';for(var j=0;j<200;j++){//這個循環(huán)還可以縮短if(j%10==0&&j!=0)s+='<br/>';if(arr.indexOf(j)>=0)s+='\u25a0';else if(j==food)s+='\u2605';elses+=' ';}document.getElementById("box").innerHTML=s;
},200);
</script></body></html>
結(jié)果：
總結(jié)
- 上一篇： JavaScript神奇的魔法代码
- 下一篇： 前端知识区别和学习路线_个人收藏