贪吃蛇

最新推荐文章于 2024-04-17 09:55:40 发布

AAAANIN

最新推荐文章于 2024-04-17 09:55:40 发布

阅读量337

点赞数

本文链接：https://blog.csdn.net/AAAANIN/article/details/77327510

版权

是完成俄罗斯方块后无聊随便写的一个这个比俄罗斯方块好多了

还是显示和操作数据分开写这样的思路很好

不多说直接上代码很简单的小游戏

<html>
<head>
    <meta charset="utf-8"/>
</head>
<body>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
<canvas id="myCanvas" width="1000" height="600" style="border:5px solid #d3d3d3;">
    您的浏览器不支持 HTML5 canvas 标签。
</canvas>
<button id="btn" type="button" οnclick="kaishi()"> 开始游戏</button>
<script>
    var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");

    function kaishi() {
        //o 为随机产生食物的x p 为随机产生食物的y
        var t = 1;
        var length = 3;
        var map = new Array();//把画布定义为一个二维数组并且值为0；
        for (var k = 0; k < 20; k++) {
            map[k] = new Array();
            for (var j = 0; j < 12; j++) {
                map[k][j] = 0;
            }
        }
        k = Math.floor(Math.random() * 15 + 3);
        m = Math.floor(Math.random() * 9 + 3);
        o = Math.floor(Math.random() * 15 + 3);
        p = Math.floor(Math.random() * 9 + 3);
        var snake = [];//把画布定义为一个二维数组并且值为0；
        for (i = 0; i < length; i++) {
            var snake_children = {
                x: k,
                y: m,
                me: 1,
            }
            k = k + 1;
            snake.push(snake_children);
        }

        function move(t) {
            if (t == 1) {
                clearInterval(run);
                run = setInterval(left, 500)
            }
            if (t == 2) {
                clearInterval(run);
                run = setInterval(up, 500)
            }
            if (t == 3) {
                clearInterval(run);
                run = setInterval(right, 500)
            }
            if (t == 4) {
                clearInterval(run);
                run = setInterval(down, 500)
            }
        }

        function clearCanvas() {
            c.height = c.height;
        }

        function over() {
            alert("GAME OVER!!!");
            for (i = 0; i < snake.length; ++i)
                snake[i] = 0;
            o = undefined;
            p = undefined;
            chushihua();
            clearCanvas();
            clearInterval(run);
            clearInterval(stop);
        }

        function showkey() {
            key = event.keyCode;
            if (key == 37) move(1);//向左移动
            if (key == 38) move(2);//向上移动
            if (key == 39) move(3);//向右移动
            if (key == 40) move(4);//向下移动
        }

        document.onkeydown = showkey;

        function len() {
            //snake 的长度加一并且头为 这个东西的x y值
            if (snake[0].y == p && snake[0].x == o) {
                length++;
                o = Math.floor(Math.random() * 15 + 3);
                p = Math.floor(Math.random() * 9 + 3);
            }
            else {
                delete snake[length - 1]//删除一维数组中最后一个值
            }
        }

        function is(t) {//判断条件
            for (i = 0; i < length; i++)
                if (snake[i].x < 1 || snake[i].x > 18 || snake[i].y < 0 || snake[i].y > 11)
                    return true;
                else if (t == 1 && map[snake[i].x - 1][snake[i].y] == snake[i].me)
                    return true;
                else if (t == 3 && map[snake[i].x + 1][snake[i].y] == snake[i].me)
                    return true;
                else if (t == 2 && map[snake[i].x][snake[i].y - 1] == snake[i].me)
                    return true;
                else if (t == 4 && map[snake[i].x][snake[i].y + 1] == snake[i].me)
                    return true;
                else
                    return false;
        }

        function fuzhi() {
            chushihua();
            for (i = 0; i < length; i++)
                if (snake[i].me == 1)
                    map[snake[i].x][snake[i].y] = 1;
        }

        function chushihua() {
            for (var k = 0; k < 20; k++) {
                for (var j = 0; j < 12; j++) {
                    map[k][j] = 0;
                }
            }
        }

        function down() {
            if (is(4)) {
                over();
            }
            else {
                mapx = snake[0].x
                mapy = snake[0].y
                len()
                var s = {
                    x: mapx,
                    y: mapy + 1,
                    me: 1,
                }
                snake.unshift(s);
                fuzhi()
            }
        }

        function up() {
            if (is(2)) {
                over();
            }
            else {
                mapx = snake[0].x
                mapy = snake[0].y
                len()
                var s = {
                    x: mapx,
                    y: mapy - 1,
                    me: 1,
                }
                snake.unshift(s);
                fuzhi()
            }
        }

        function right() {
            if (is(3)) {
                over();
            }
            else {
                mapx = snake[0].x
                mapy = snake[0].y
                len()
                var s = {
                    x: mapx + 1,
                    y: mapy,
                    me: 1,
                }
                snake.unshift(s);
                fuzhi()
            }
        }

        function left() {
            if (is(1)) {
                over();
            }
            else {
                mapx = snake[0].x
                mapy = snake[0].y
                len()
                var s = {
                    x: mapx - 1,
                    y: mapy,
                    me: 1,
                }
                snake.unshift(s);
                fuzhi()
            }
        }

        function hsnake() {
            clearCanvas()
            for (i = 0; i < length; i++)
                if (snake[i].me == 1)
                    ctx.fillRect(snake[i].x * 50, snake[i].y * 50, 50, 50)
            ctx.fillStyle = "#1E90FF";
            ctx.fillRect(o * 50, p * 50, 50, 50)
        }

        run = setInterval(left, 500)
        stop = setInterval(hsnake, 0)
    }
</script>
</body>

AAAANIN

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
贪吃蛇

是完成俄罗斯方块后无聊随便写的一个这个比俄罗斯方块好多了还是显示和操作数据分开写这样的思路很好不多说直接上代码很简单的小游戏html>head> meta charset="utf-8"/>head>body>script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.
复制链接

扫一扫