| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 2478 人关注过本帖
标题:JS 贪吃蛇代码学习讨论(DOM 遍历,非数组
只看楼主 加入收藏
gupiao175
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:40
帖 子:1787
专家分:7527
注 册:2007-6-27
收藏
得分:0 
顺道推荐一下8月19日上演的新片<喋血孤城>,8月24日上传的资源!效果还不错!有中文字母,普通话!
下载QVOD,在IE下输入http://www.
同期值得看的还有甄子丹演的《精武风云》,9月才全国上上映!

Q:1428196631,百度:开发地 即可找到我,有事请留言!
2010-08-26 21:37
foktime
Rank: 11Rank: 11Rank: 11Rank: 11
来 自:奥斯维辛
等 级:贵宾
威 望:35
帖 子:795
专家分:2742
注 册:2009-9-4
收藏
得分:0 
回去看看 一直在等新片
2010-08-27 08:14
gupiao175
Rank: 16Rank: 16Rank: 16Rank: 16
等 级:版主
威 望:40
帖 子:1787
专家分:7527
注 册:2007-6-27
收藏
得分:0 
程序代码:
<script type="text/javascript">
var snake={
           st:500,//速度初始为0.5秒移动一次,数值越小速度越快!
           num:0,
      start:function(){//初始化,建立外围DIV框架,键盘事件,食物或蛇的初始数量和位置
           div=document.createElement('div');
      div.style.cssText="position:absolute;margin:0;padding:0;left:300px;top:20px;width:400px;height:400px;border:1px solid #000;";
           div.id='kj';
           div1=document.createElement('div');
      div1.style.cssText="position:absolute;margin:0;padding:0;left:300px;top:430px;width:400px;height:100px;";
           document.body.appendChild(div);
           document.body.appendChild(div1);
           div1.innerHTML='键盘上↑↓←→代表方向控制,小键盘上0加速,1减速,空格暂停!';
           document.onkeydown=function(e){
           e=e||window.event;
           snake.direction=Math.abs(snake.direction-e.keyCode)!=2?e.keyCode:snake.direction;
           if(Math.abs(snake.direction-e.keyCode)==2)return false;//彻底禁止反方向键,这句是核心!
           snake.dir();
            }
          
           this.createshe(0,200);
           this.createshe(20,200);
           this.createfood();

         
          },
     pause:function(){//游戏暂停
           clearTimeout(this.tt);
          },
createfood:function(){//产生选区内的一个随机坐标的食物(SPAN标签)!
           this.x=Math.round(Math.random()*19)*20;
           this.y=Math.round(Math.random()*19)*20;
           this.p=document.getElementsByTagName("p");//获得所有蛇对象
          
           while(this.checkbody(this.x,this.y))
           {//进行循环判断,让随即生成的食物位置不能和蛇的位置重合,重合就重刷随机数!
           this.x=Math.round(Math.random()*19)*20;
           this.y=Math.round(Math.random()*19)*20;
           }
           this.food=document.createElement("span");
           this.food.style.cssText="position:absolute;width:20px;height:20px;background:green;border:1px solid #ccc;";
           this.food.style.left=this.x+"px";
           this.food.style.top=this.y+"px";
           document.getElementById('kj').appendChild(this.food);
          },
createshe:function(a,b){//用P标签创建蛇!
           var sna=document.createElement("p");
           sna.style.cssText="position:absolute;margin:0;padding:0;width:20px;height:20px;background:red;border:1px solid #ccc;";
           sna.style.left=parseInt(a)+"px";
           sna.style.top=parseInt(b)+"px";
           this.x1=parseInt(a);
           this.y1=parseInt(b);
           document.getElementById('kj').appendChild(sna);
          },
      dir:function(){//方向控制
           //var edir;
           if(typeof(this.tt)!='undefined'){clearTimeout(this.tt);}//防止方向键多次键入导致速度不断增加!
           //alert(snake.direction);
           switch(snake.direction)
           {
           case 37:this.gox = -20;this.goy=0;   this.move(); break;//
           case 39:this.gox = 20; this.goy=0;   this.move(); break;//
           case 38:this.gox = 0;  this.goy=-20; this.move(); break;//
           case 40:this.gox = 0;  this.goy=20;  this.move(); break;//
           case 32:this.pause(); break;//暂停
           case 96:this.st=this.st-100;this.move();break;//加速
           case 97:this.st=this.st+100;this.move();break;//减速
           }
          },
     move:function(){//响应键盘进行移动的事件
           w=this.x1+this.gox;//每吃一次食物获得一次坐标
           h=this.y1+this.goy;
           if(w<0||w>=400||h<0||h>=400||this.checkbody(w,h))//进行边界检测和自身的碰撞检测
           {
           clearTimeout(this.tt);
           alert("Game over!吃了"+this.num+"个食物!");
           window.location.reload();//游戏结束重新刷新页面!
           }
           if(this.x1==this.x&&this.y1==this.y)
           {//判断蛇头是否遇到食物的位置,如果是就移除食物,重新生成,否则就是删除最开始建立的蛇,也就是蛇尾!
           document.getElementById('kj').removeChild(this.food);
           this.num++;
           this.createfood();
           }
           else
           {
           document.getElementById('kj').removeChild(this.p[0]);
           }
           this.createshe(w,h);
           this.tt=setTimeout("snake.dir()",this.st);
          },

 checkbody:function(a,b){//检查蛇是否碰到自身的方法
           this.p=document.getElementsByTagName("p");
           for(var i=0,j=this.p.length;i<j;i++)
           {
             if(this.p[i].style.left==a+"px"&&this.p[i].style.top==b+"px")return true;
           }
                         }
}
window.onload=function(){
snake.start();
}   
</script>


之前的代码确实有反方向问题!现在可以了!已经彻底禁止反向键效果!

Q:1428196631,百度:开发地 即可找到我,有事请留言!
2010-09-03 08:16
快速回复:JS 贪吃蛇代码学习讨论(DOM 遍历,非数组
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.026994 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved