JAVASCRIPT版贪吃蛇头走位V1可手动设置障碍

最新推荐文章于 2024-01-29 18:06:11 发布
最新推荐文章于 2024-01-29 18:06:11 发布
阅读量231 收藏
点赞数
分类专栏： JAVASCRIPT 文章标签： 贪吃蛇
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/freshet/article/details/105863062
版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<script type="text/javascript">

var a = new Array();
N=3;
curI=0;
curJ=0;
boomIJ=0;
var curTd;
    function init() {
        
        for(var i=0;i<N;i++){
            a[i] = new Array();
            for(var j=0;j<N;j++){
                a[i][j] = 0;
            }
        }
        
        var num = Math.floor(Math.random() * 9) + 1;
        var idNum = "td" + num;
        curTd=document.getElementById(idNum);
        
        curTd.style.background = "green";
        curI=parseInt((num-1)/N);
        curJ=parseInt((num-1)%N);
        
        //alert(curI+" "+curJ);
    }
    
    function check(td){
        //boomIJ=parseInt(td.parentElement.rowIndex)*N+parseInt(td.cellIndex));
        i=parseInt(td.parentElement.rowIndex);
        j=parseInt(td.cellIndex);
        boomIJ=i*N+j;
        td.style.background = "red";
        //alert(boomIJ);
    }
    

    function turn(event) {
        var e = event;//|| window.event || arguments.callee.caller.arguments[0];

        
        
        //alert(e.keyCode);
        if (e && e.keyCode == 38 ) {
            if(curI-1>=0){
                curTd.style.background = "";
                var idNum=(curI-1)*N+curJ+1;
                curI=curI-1;
                curTd=document.getElementById(("td"+idNum));
                curTd.style.background = "green";
                
                //alert(curI+" "+curJ+" "+boomIJ)
                if(curI*N+curJ == boomIJ){
                    alert("game over!");
                    return;
                }
            }
            //alert('38=上键');
            
            
        }

        if ( e.keyCode == 39) {
            //alert('39=右键');
            if(curJ+1<N){
                curTd.style.background = "";
                curJ=curJ+1;
                var idNum=curI*N+curJ+1;
                
                curTd=document.getElementById(("td"+idNum));
                curTd.style.background = "green";
                
                //alert(curI+" "+curJ+" "+boomIJ)
                if(curI*N+curJ == boomIJ){
                    alert("game over!");
                    return;
                }
            }
            
            
        }

        if ( e.keyCode == 37) {
            //alert('37=左键');
            if(curJ-1>=0){
                curTd.style.background = "";
                curJ=curJ-1;
                var idNum=curI*N+curJ+1;
                curTd=document.getElementById(("td"+idNum));
                curTd.style.background = "green";
                //alert(curI+" "+curJ+" "+boomIJ)
                if(curI*N+curJ == boomIJ){
                    alert("game over!");
                    return;
                }
            }
        }

        if (e && e.keyCode == 40 ) {
            //alert('40=下键');
            if(curI+1<N){
                curTd.style.background = "";
                curI=curI+1;
                var idNum=curI*N+curJ+1;                
                curTd=document.getElementById(("td"+idNum));
                curTd.style.background = "green";
                //alert(curI+" "+curJ+" "+boomIJ)
                if(curI*N+curJ == boomIJ){
                    alert("game over!");
                    return;
                }
            }
            
            
        }
        
        
    }

    window.onload = init;
</script>
</head>
<body οnkeydοwn="turn(event)">

    <table style="width: 50%; height: 300px;" border="1">
        <tr>
            <td id="td1" οnclick="check(this)" οnkeydοwn="turn(event)">1</td>
            <td id="td2" οnclick="check(this)" οnkeydοwn="turn(event)">2</td>
            <td id="td3" οnclick="check(this)" οnkeydοwn="turn(event)">3</td>
        </tr>
        <tr>
            <td id="td4" οnclick="check(this)" οnkeydοwn="turn(event)">4</td>
            <td id="td5" οnclick="check(this)" οnkeydοwn="turn(event)">5</td>
            <td id="td6" οnclick="check(this)" οnkeydοwn="turn(event)">6</td>
        </tr>
        <tr>
            <td id="td7" οnclick="check(this)" οnkeydοwn="turn(event)">7</td>
            <td id="td8" οnclick="check(this)" οnkeydοwn="turn(event)">8</td>
            <td id="td9" οnclick="check(this)" οnkeydοwn="turn(event)">9</td>

        </tr>
    </table>
</body>
</html>

FRESHET
关注
专栏目录
java实现有障碍物的贪吃蛇游戏
10-07
利用Java实现的贪吃蛇游戏设计，包含关卡、速度、分数等信息，有障碍物；符合贪吃蛇游戏的所有设计理念，贪吃蛇吃到食物，身体会自增等等。
Js 贪吃蛇
忘川
08-22 316
<!DOCTYPE html> <html> <head> <title>贪吃蛇</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> .backDiv { text-align: center; ...
c语言实战之贪吃蛇
最新发布
2302_79539362的博客
01-29 1万+
c语言实战之贪吃蛇
【C/C++实战项目】贪吃蛇游戏
phoenixFlyzzz的博客
03-15 6478
C语言代码实现贪吃蛇游戏设计、游戏机制、游戏界面、文件读写、自定义设置
贪吃蛇c语言 游戏中会出现障碍物,贪吃蛇C语言游戏代码.doc
weixin_32173041的博客
05-22 1222
贪吃蛇C语言游戏代码//////////////////////////////////////////////开始编写游戏需要的类////////////////////////////////////////////#include //EasyX_2011惊蛰版(绘图库)#include #include #include #define UP1#define DOWN2#define L...
贪吃蛇头文件
12-15
简单的贪吃蛇C语言头文件，想自己做出贪吃蛇？不妨参考一下头文件，可能会给你不一样的提示哦
html和js实现的网页版本贪吃蛇项目
04-04
《HTML与JavaScript实现的网页版贪吃蛇项目详解》 贪吃蛇，这款经典的游戏，以其简单的规则和无尽的挑战性，深受广大玩家的喜爱。如今，借助HTML和JavaScript技术，我们可以将它移植到网页上，让玩家在浏览器中就能...
flappyDragon:飞翔的贪吃龙
05-31
《飞翔的贪吃龙：JavaScript实现的趣味游戏》 在当今的互联网世界中，JavaScript作为最流行的编程语言之一，不仅广泛应用于网页开发，还在游戏制作领域大放异彩。"flappyDragon"就是一个以JavaScript为基础，创造出...
微信小程序-贪吃的小蛇蛇
05-07
"贪吃的小蛇蛇"是一个基于微信小程序开发的游戏，利用JavaScript（JS）编程语言实现，为用户带来类似于经典游戏“贪吃蛇”的玩法。 在开发微信小程序时，我们需要掌握以下几个核心知识点： 1. **微信小程序框架**...
贪吃蛇_C语言_贪吃_贪吃蛇_
09-30
1. **蛇的移动**：蛇的位置由一系列坐标表示，每次更新时，蛇头会根据玩家输入的方向移动一格，同时蛇身的其他部分也要相应地向前移动。 2. **食物生成**：随机在游戏区域内生成一个食物点，当蛇头碰到食物时，蛇身...
贪吃蛇游戏开发_增加障碍物石头
09-01
java贪吃蛇游戏编程代码---增加障碍物石头，包括代码、视频，很详细！！
java贪吃蛇（障碍物*咬尾巴）
neverlesspray的博客
07-31 2886
ArrayList的各种方法addAll(),add(),remove(),clear()，与数组的区别 退出：System.exit(0); JPanel的paintComponent(Graphics g)方法，有GUI系统调用，或者调用JPanel.repaint()重绘 KeyListener监听按键事件，非数字去方向键为VK_DOWN..数字区方向键为VK_PK_... Timer tim
Swing贪吃蛇游戏(二)：增加随机产生障碍物功能
u010633678的专栏
07-26 2380
在上一篇博文中，介绍了Swing贪吃蛇游戏基本功能的实现： Swing贪吃蛇游戏(一)：基本功能实现 >>>> [url]http://mouselearnjava.iteye.com/blog/1913290[/url] 本文在原有基本功能上增加随机产生障碍物的功能，增加些游戏的难度 :) 随机产生障碍物的功能可以有多种实现，我们可以将分数的改变作为产生随机数的条件，比如...
JS 原生js实现贪吃蛇小游戏（含详细注释）
夏沐的博客
02-28 5706
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;title&lt;/title&gt; &lt;style&gt; .map{ width:800px; height:600px;
HTML实现贪吃蛇
Jaybo
04-14 8437
<!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.onkey
python制作贪吃蛇游戏_python实现贪吃蛇游戏源码
weixin_39849942的博客
11-23 160
本文实例为大家分享了python实现贪吃蛇的具体代码，供大家参考，具体内容如下import pygameimport sysimport randomSCREEN_X=600SCREEN_Y=600class Snake(object):def __init__(self):self.direction=pygame.K_RIGHTself.body = []for i in range(5):s...
你真以为贪吃蛇是个简单的游戏？
大田二十
08-12 6646
你真以为贪吃蛇是个简单的游戏？
c语言贪吃蛇怎么设置障碍物,c语言怎么自定义信号，贪吃蛇想关
weixin_35779001的博客
05-24 629
该楼层疑似违规已被系统折叠隐藏此楼查看此楼#include #include #include #include #include using namespace std;#defineA_MOVE_LEFT SIGRTMIN+1#define D_MOVE_RIGHTSIGRTMIN+2#define W_MOVE_ARROWSIGRTMIN+3#define S_MOVE_BACKSIGRT...
Html实现贪吃蛇
qq_44023710的博客
01-26 2036
HTML实现贪吃蛇 <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Snake</title> </head> <body style="text-align:center;margin:100px;background-color:#aaaaaa"
贪吃虫javascript代码
06-07
好的，以下是一个简单的贪吃虫的 JavaScript 代码示例，供您参考： ```html <!DOCTYPE html> 贪吃虫游戏 canvas { border: 1px solid #000; } <canvas id="canvas" width="400" height="400"></...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值