HTML+CSS+JS制作【飞机大战】小游戏(键盘版和鼠标版)

文章目录
一、效果演示
设计思路
二、鼠标版飞机大战代码展示
1.HTML结构代码
2.CSS样式代码
3.JavaScript代码
js.js文件
plane.js文件
三、键盘版飞机大战代码展示
1.HTML结构代码
2.CSS样式代码
3.JavaScript代码
四、代码资源分享
一、效果演示
利用html,css,js制作出飞机大战的简易版
需要代码的小伙伴可以在文章末尾资源自行下载,下载打开运行在浏览器即可游戏,本篇资源分享分为两个版本,一个是键盘版本(awsd移动和k攻击),一个是鼠标移动版

设计思路
在游戏进行界面中,通过鼠标操控自己方飞机(仅一架),在初始化时就进行无限制的匀速发射子弹。

在游戏进行界面中,左上方有得到的分数显示,敌方飞机有三种类型(小,中,大),他们的形状,大小,击落的分数各不同,以合适的速度控制它们的数量,以及运动的速度。

在进行游戏的过程中点击鼠标左键会进入游戏暂停界面,有重新开始,回到主页,继续三个选项。当游戏结束时,会弹出游戏分数框,有继续按钮,点击回到主页。

二、鼠标版飞机大战代码展示
1.HTML结构代码
<body>
    <div id="plane">
        <span>分数:<strong style="font-weight: normal;">0</strong></span>
    </div>
    <script type="text/javascript" src="js.js"></script>
    <script type="text/javascript" src="plane.js"></script>
</body>
1
2
3
4
5
6
7
2.CSS样式代码
<style type="text/css">
        *{
            padding:0px;
            margin:0px;
        }
        #plane{
            width: 320px;
            height: 568px;
            background: url(img/background.png);
            position: relative;
            margin:50px auto 0;
            cursor: none;
            overflow: hidden;
        }
        #plane span{
            position: absolute;
            right:10px;
            top:5px;
        }
    </style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
3.JavaScript代码
js.js文件
//缓冲运动
function getStyle(obj, attr) {
    if (obj.currentStyle) {
        return obj.currentStyle[attr];
    } else {
        return getComputedStyle(obj)[attr];
    }
}


function startMove(obj, json, fn) {
    var cur = 0;
    var timer = null;
    var speed = null;
    clearInterval(obj.timer)
    obj.timer = setInterval(function() {
        var bstop = true;
        for (var attr in json) {
            if (attr == 'opacity') {//求初始值
                cur = Math.round(getStyle(obj, attr) * 100);
            } else {
                cur = parseInt(getStyle(obj, attr));
            }
            speed = (json[attr] - cur) / 8;
            speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed); 
            if (cur != json[attr]) {
                bstop = false;
                if (attr == 'opacity') {
                    obj.style[attr] = (cur + speed) / 100;
                    obj.style.filter = 'alpha(opacity=' + (cur + speed) + ')';
                } else {
                    obj.style[attr] = cur + speed + 'px';
                }
            }
        }
        if (bstop) {
            clearInterval(obj.timer);
            fn && fn();
        }
    }, 30);
}

//通过类名获取元素
function getClass(oClass, oParent) {
    var oP = oParent || document;
    var arr = [];
    var aEle = oP.getElementsByTagName('*');
    var reg = new RegExp('\\b' + oClass + '\\b');
    for (var i = 0; i < aEle.length; i++) {
        if (reg.test(aEle[i].className)) {
            arr.push(aEle[i]);
        }
    }
    return arr;
}


//取任意的随机数,范围是min-max之间
function getrandom(min,max){
    return Math.floor(Math.random()*(max-min+1))+min;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
plane.js文件
//我方飞机构造函数
var planeBox = document.getElementById('plane');
var planescore = document.getElementsByTagName('strong')[0];
var zscore = 0;


function Myplane(w, h, imgsrc, boomsrc) {
    this.w = w;
    this.h = h;
    this.imgsrc = imgsrc;
    this.boomsrc = boomsrc;
    this.createMyplane();
}


//创建我方飞机
Myplane.prototype.createMyplane = function() {
    this.plane = document.createElement('img');
    this.plane.src = this.imgsrc;
    this.plane.style.cssText = 'width:' + this.w + 'px;height:' + this.h + 'px;position:absolute;left:' + (planeBox.offsetWidth - this.w) / 2 + 'px;top:' + (planeBox.offsetHeight - this.h) + 'px;';
    planeBox.appendChild(this.plane);
    this.move();
    this.shoot();
};


//我方飞机移动
Myplane.prototype.move = function() {
    var that = this;
    document.onmousemove = function(ev) {
        var ev = ev || window.event;
        that.oLeft = ev.clientX - plane.offsetLeft - that.w / 2;
        that.oTop = ev.clientY - plane.offsetTop - that.h / 2;
        if (that.oLeft < 0) {
            that.oLeft = 0;
        } else if (that.oLeft >= plane.offsetWidth - that.w) {
            that.oLeft = plane.offsetWidth - that.w
        }


        if (that.oTop < 0) {
            that.oTop = 0;
        } else if (that.oTop >= plane.offsetHeight - that.h) {
            that.oTop = plane.offsetHeight - that.h;
        }


        that.plane.style.left = that.oLeft + 'px';
        that.plane.style.top = that.oTop + 'px';
        return false;
    }
};
//我方飞机发射子弹
Myplane.prototype.shoot = function() {
    var that = this;
    document.onmousedown = function(ev) {
        var ev = ev || window.event;
        if (ev.which == 1) {
            bulletshoot();
            that.timer = setInterval(bulletshoot, 200);


            function bulletshoot() {
                var bullet = new Bullet(that.plane.offsetLeft + that.w / 2 - 3, that.plane.offsetTop - 14, 6, 14, 'img/bullet.png');
            }
        }
        return false;
    }
    document.onmouseup = function(ev) {
        var ev = ev || window.event;
        if (ev.which == 1) {
            clearInterval(that.timer);
        }
    }
    document.oncontextmenu = function() {
        return false;
    }
};


//子弹的构造函数
function Bullet(x, y, w, h, imgsrc) {
    this.x = x; //位置
    this.y = y;
    this.w = w; //尺寸
    this.h = h;
    this.imgsrc = imgsrc;
    this.createBullet();
}


//创建子弹
Bullet.prototype.createBullet = function() {
    this.bullet = document.createElement('img');
    this.bullet.src = this.imgsrc;
    this.bullet.style.cssText = 'width:' + this.w + 'px;height:' + this.h + 'px;position:absolute;left:' + this.x + 'px;top:' + this.y + 'px;';
    planeBox.appendChild(this.bullet);
    this.move();
}


//子弹移动
Bullet.prototype.move = function() {
    var that = this;
    this.timer = setInterval(function() {
        that.y -= 5;
        if (that.y <= -that.h) {
            clearInterval(that.timer);
            planeBox.removeChild(that.bullet);
        }
        that.bullet.style.top = that.y + 'px';
        that.hit();
    }, 20);
};


Bullet.prototype.hit = function() {
    var allEnemy = document.getElementsByClassName('planeEnemy');
    for (var i = 0; i < allEnemy.length; i++) {
        if ((this.x + this.w) >= allEnemy[i].offsetLeft && this.x <= (allEnemy[i].offsetLeft + allEnemy[i].offsetWidth) && this.y <= (allEnemy[i].offsetTop + allEnemy[i].offsetHeight)) {
            clearInterval(this.timer);
            try{


            planeBox.removeChild(this.bullet);
            }catch(e){


            }
            allEnemy[i].hp--;
            allEnemy[i].checkhp();
        }
    }
};

//敌方飞机的构造函数
function Enemyplane(x, y, w, h, imgsrc, boomsrc, speed, hp, score) {
    this.x = x; //位置
    this.y = y;
    this.w = w; //尺寸
    this.h = h;
    this.imgsrc = imgsrc;
    this.boomsrc = boomsrc;
    this.speed = speed;
    this.hp = hp;
    this.score = score;
    this.createEnemy();
}


//创建敌机
Enemyplane.prototype.createEnemy = function() {
    var that = this;
    this.enemy = document.createElement('img');
    this.enemy.src = this.imgsrc;
    this.enemy.className = 'planeEnemy'; //通过设置类名,方便后面获取
    this.enemy.style.cssText = 'width:' + this.w + 'px;height:' + this.h + 'px;position:absolute;left:' + this.x + 'px;top:' + this.y + 'px;';
    planeBox.appendChild(this.enemy);
    this.enemy.hp = this.hp; //变化的
    this.enemy.score = this.score; //变化的
    this.enemy.checkhp = function() { //this==this.enemy 
        if (this.hp <= 0) {
            clearInterval(this.timer);
            this.className = '';
            this.src = that.boomsrc;
            setTimeout(function() {
                planeBox.removeChild(that.enemy);
            }, 1000);
            zscore += this.score
            planescore.innerHTML = zscore;
        }
    }
    this.move();
}


Enemyplane.prototype.move = function() {
    var that = this;
    this.enemy.timer = setInterval(function() {
        that.y += that.speed;
        if (that.y >= planeBox.offsetHeight) {
            clearInterval(that.enemy.timer);
            planeBox.removeChild(that.enemy);
        }
        that.enemy.style.top = that.y + 'px';
        that.enemyhit();
    }, 50);
}

Enemyplane.prototype.enemyhit = function() {
    if ((this.y + this.h) >= myplane.oTop && this.y <= (myplane.oTop + myplane.h) && (this.x + this.w) > myplane.oLeft && this.x <= (myplane.oLeft + myplane.w)) {
        var allEnemy = document.getElementsByClassName('planeEnemy');
        for (var i = 0; i < allEnemy.length; i++) {
            clearInterval(allEnemy[i].timer);
        }
        clearInterval(timer);
        document.onmousedown = null;
        document.onmousemove = null;
        myplane.plane.src = myplane.boomsrc;
        setTimeout(function() {
            alert('game over!!');
            window.location.reload(); //重刷新
        }, 3000);
    }
}


var myplane = new Myplane(66, 80, 'img/myplane.gif', 'img/myplaneBoom.gif');


for (var i = 0; i < getrandom(1, 2); i++) { //随机创建各类飞机
    var timer = setInterval(function() {
        var num = getrandom(1, 20); //1-15 小飞机  16-20 中飞机  20打飞机
        if (num >= 1 && num < 15) {
            var enemy = new Enemyplane(getrandom(0, planeBox.offsetWidth - 34), -24, 34, 24, 'img/smallplane.png', 'img/smallplaneboom.gif', getrandom(3, 5), 1, 1);
        } else if (num >= 15 && num < 20) {
            var enemy = new Enemyplane(getrandom(0, planeBox.offsetWidth - 46), -60, 46, 60, 'img/midplane.png', 'img/midplaneboom.gif', getrandom(2, 4), 3, 5);
        } else if (num == 20) {
            var enemy = new Enemyplane(getrandom(0, planeBox.offsetWidth - 110), -164, 110, 164, 'img/bigplane.png', 'img/bigplaneboom.gif', getrandom(1, 2), 10, 10);
        }
    }, 1000)
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
三、键盘版飞机大战代码展示
1.HTML结构代码
<body>
    <div class="gamebox">
        <span>分数:<em>0</em></span>
    </div>
    <script type="text/javascript" src="plane.js"></script>
</body>
1
2
3
4
5
6
2.CSS样式代码
 <style type="text/css">
    * {
        padding: 0px;
        margin: 0px;    
    }
    .gamebox{
        width: 320px;
        height:568px;
        background: url(img/background.png) repeat-y;
        margin:20px auto;
        position: relative;
        cursor: none;
        overflow: hidden;
    }
    .gamebox span{
        position: absolute;
        right:10px;
        top:10px;
    }
    .gamebox span em{
        font-style: normal;
    }
    </style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
3.JavaScript代码
;
(function() {
    var gamebox = document.querySelector('.gamebox');
    var oEm = document.querySelector('em');
    var zscore = 0;
    //1.让背景运动起来
    var bgposition = 0;
    var bgtimer = setInterval(function() {
        bgposition += 2;
        gamebox.style.backgroundPosition = '0 ' + bgposition + 'px';
    }, 30);

    //2.我方飞机的构造函数
    function Myplane(w, h, x, y, imgurl, boomurl) { //w,h宽高 x,y位置  imgurl和boomurl我方飞机的图片路径
        this.w = w;
        this.h = h;
        this.x = x;
        this.y = y;
        this.imgurl = imgurl;
        this.boomurl = boomurl;
        this.createmyplane()
    }
    //2.1创建我方飞机
    Myplane.prototype.createmyplane = function() {
        this.myplaneimg = document.createElement('img');
        this.myplaneimg.src = this.imgurl;
        this.myplaneimg.style.cssText = `width:${this.w}px;height:${this.h}px;position:absolute;left:${this.x}px;top:${this.y}px;`;
        gamebox.appendChild(this.myplaneimg);
        //飞机创建完成,执行运动和发射子弹
        this.myplanemove();
        this.myplaneshoot();
    }
    //2.2键盘控制我方飞机移动
    Myplane.prototype.myplanemove = function() {
        var that = this;
        //方向定时器
        var uptimer = null,
            downtimer = null,
            lefttimer = null,
            righttimer = null;
        var uplock = true,
            downlock = true,
            leftlock = true,
            rightlock = true;
        document.addEventListener('keydown', movekey, false); //movekey:事件处理函数
        function movekey(ev) { //W:87 A:65 S:83 D:68  K:75
            var ev = ev || window.event;
            switch (ev.keyCode) {
                case 87:
                    moveup(); // 上
                    break;
                case 83:
                    movedown(); // 下
                    break;
                case 65:
                    moveleft(); // 左
                    break;
                case 68:
                    moveright(); // 右
                    break;
            }


            function moveup() {
                if (uplock) {
                    uplock = false;
                    clearInterval(downtimer);
                    uptimer = setInterval(function() {
                        that.y -= 4;
                        if (that.y <= 0) {
                            that.y = 0;
                        }
                        that.myplaneimg.style.top = that.y + 'px';
                    }, 30);
                }


            }


            function movedown() {
                if (downlock) {
                    downlock = false;
                    clearInterval(uptimer);
                    downtimer = setInterval(function() {
                        that.y += 4;
                        if (that.y >= gamebox.offsetHeight - that.h) {
                            that.y = gamebox.offsetHeight - that.h;
                        }
                        that.myplaneimg.style.top = that.y + 'px';
                    }, 30);
                }


            }


            function moveleft() {
                if (leftlock) {
                    leftlock = false;
                    clearInterval(righttimer);
                    lefttimer = setInterval(function() {
                        that.x -= 4;
                        if (that.x <= 0) {
                            that.x = 0;
                        }
                        that.myplaneimg.style.left = that.x + 'px';
                    }, 30);
                }


            }


            function moveright() {
                if (rightlock) {
                    rightlock = false;
                    clearInterval(lefttimer);
                    righttimer = setInterval(function() {
                        that.x += 4;
                        if (that.x >= gamebox.offsetWidth - that.w) {
                            that.x = gamebox.offsetWidth - that.w;
                        }
                        that.myplaneimg.style.left = that.x + 'px';
                    }, 30);
                }


            }


        }


        document.addEventListener('keyup', function(ev) {
            var ev = ev || window.event;
            if (ev.keyCode == 87) {
                clearInterval(uptimer);
                uplock=true;
            }


            if (ev.keyCode == 83) {
                clearInterval(downtimer);
                downlock=true;
            }


            if (ev.keyCode == 65) {
                clearInterval(lefttimer);
                leftlock=true;
            }


            if (ev.keyCode == 68) {
                clearInterval(righttimer);
                rightlock=true;
            }
        }, false);
    }


    //2.3我方飞机发射子弹
    Myplane.prototype.myplaneshoot = function() {
        var that = this;
        var shoottimer = null;
        var shootlock = true;
        document.addEventListener('keydown', shootbullet, false);


        function shootbullet(ev) {
            var ev = ev || window.event;
            if (ev.keyCode == 75) {
                if (shootlock) {
                    shootlock = false;


                    function shoot() {
                        new Bullet(6, 14, that.x + that.w / 2 - 3, that.y - 14, 'img/bullet.png');
                    }
                    shoot();
                    shoottimer = setInterval(shoot, 200);
                }
            }
        }
        document.addEventListener('keyup', function(ev) {
            var ev = ev || window.event;
            if (ev.keyCode == 75) {
                clearInterval(shoottimer);
                shootlock = true;
            }
        }, false);
    }

    //3.子弹的构造函数
    function Bullet(w, h, x, y, imgurl) { //w,h宽高 x,y位置  imgurl图片路径
        this.w = w;
        this.h = h;
        this.x = x;
        this.y = y;
        this.imgurl = imgurl;
        //创建子弹
        this.createbullet();
    }


    //3.1创建子弹
    Bullet.prototype.createbullet = function() {
        this.bulletimg = document.createElement('img');
        this.bulletimg.src = this.imgurl;
        this.bulletimg.style.cssText = `width:${this.w}px;height:${this.h}px;position:absolute;left:${this.x}px;top:${this.y}px;`;
        gamebox.appendChild(this.bulletimg);
        //子弹创建完成,执行运动。
        this.bulletmove();
    }
    //3.2子弹运动
    Bullet.prototype.bulletmove = function() {
        var that = this;
        this.timer = setInterval(function() {
            that.y -= 4;
            if (that.y <= -that.h) { //让子弹消失
                clearInterval(that.timer);
                gamebox.removeChild(that.bulletimg);
            }
            that.bulletimg.style.top = that.y + 'px';
            that.bullethit();
        }, 30)


    }
    Bullet.prototype.bullethit = function() {
        var enemys = document.querySelectorAll('.enemy');
        for (var i = 0; i < enemys.length; i++) {
            if (this.x + this.w >= enemys[i].offsetLeft && this.x <= enemys[i].offsetLeft + enemys[i].offsetWidth && this.y + this.h >= enemys[i].offsetTop && this.y <= enemys[i].offsetTop + enemys[i].offsetHeight) {
                clearInterval(this.timer);
                try {
                    gamebox.removeChild(this.bulletimg);
                } catch (e) {
                    return;
                }


                //血量减1
                enemys[i].blood--;
                //监听敌机的血量(给敌机添加方法)
                enemys[i].checkblood();
            }
        }


    }
    //4.敌机的构造函数
    function Enemy(w, h, x, y, imgurl, boomurl, blood, score, speed) {
        this.w = w;
        this.h = h;
        this.x = x;
        this.y = y;
        this.imgurl = imgurl;
        this.boomurl = boomurl;
        this.blood = blood;
        this.score = score;
        this.speed = speed;
        this.createenemy();
    }


    //4.1创建敌机图片
    Enemy.prototype.createenemy = function() {
        var that = this;
        this.enemyimg = document.createElement('img');
        this.enemyimg.src = this.imgurl;
        this.enemyimg.style.cssText = `width:${this.w}px;height:${this.h}px;position:absolute;left:${this.x}px;top:${this.y}px;`;
        gamebox.appendChild(this.enemyimg);


        this.enemyimg.className = 'enemy'; //给每一架创建的敌机添加类
        this.enemyimg.score = this.score; //给每一架创建的敌机添加分数
        this.enemyimg.blood = this.blood; //给每一架创建的敌机添加自定义的属性--血量
        this.enemyimg.checkblood = function() {
            //this==>this.enemyimg
            if (this.blood <= 0) { //敌机消失爆炸。
                this.className = ''; //去掉类名。
                this.src = that.boomurl;
                clearInterval(that.enemyimg.timer);
                setTimeout(function() {
                    gamebox.removeChild(that.enemyimg);
                }, 300);
                zscore += this.score;
                oEm.innerHTML = zscore;
            }
        }
        //子弹创建完成,执行运动。
        this.enemymove();
    }
    //4.2敌机运动
    Enemy.prototype.enemymove = function() {
        var that = this;
        this.enemyimg.timer = setInterval(function() {
            that.y += that.speed;
            if (that.y >= gamebox.offsetHeight) {
                clearInterval(that.enemyimg.timer);
                gamebox.removeChild(that.enemyimg);
            }
            that.enemyimg.style.top = that.y + 'px';
            that.enemyhit();
        }, 30);
    }


    //4.3敌机碰撞我方飞机
    Enemy.prototype.enemyhit = function() {
        if (!(this.x + this.w < ourplane.x || this.x > ourplane.x + ourplane.w || this.y + this.h < ourplane.y || this.y > ourplane.y + ourplane.h)) {
            var enemys=document.querySelectorAll('.enemy');
            for (var i = 0; i < enemys.length; i++) {
                clearInterval(enemys[i].timer);
            }
            clearInterval(enemytimer);
            clearInterval(bgtimer);
            ourplane.myplaneimg.src = ourplane.boomurl;
            setTimeout(function() {
                gamebox.removeChild(ourplane.myplaneimg);
                alert('game over!!');
                location.reload();
            }, 300)
        }
    }


    var enemytimer = setInterval(function() {
        for (var i = 0; i < ranNum(1, 3); i++) {
            var num = ranNum(1, 20); //1-20
            if (num < 15) { //小飞机
                new Enemy(34, 24, ranNum(0, gamebox.offsetWidth - 34), -24, 'img/smallplane.png', 'img/smallplaneboom.gif', 1, 1, ranNum(2, 4));
            } else if (num >= 15 && num < 20) {
                new Enemy(46, 60, ranNum(0, gamebox.offsetWidth - 46), -60, 'img/midplane.png', 'img/midplaneboom.gif', 3, 5, ranNum(1, 3));
            } else if (num == 20) {
                new Enemy(110, 164, ranNum(0, gamebox.offsetWidth - 110), -164, 'img/bigplane.png', 'img/bigplaneboom.gif', 10, 10, 1);
            }
        }
    }, 3000);


    function ranNum(min, max) {
        return Math.round(Math.random() * (max - min)) + min;
    }
    //实例化我方飞机
    var ourplane = new Myplane(66, 80, (gamebox.offsetWidth - 66) / 2, gamebox.offsetHeight - 80, 'img/myplane.gif', 'img/myplaneBoom.gif');
})();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
四、代码资源分享
💡点击链接下载飞机大战i资源https://gitee.com/huang_weifu/JavaScript_demo.git

关注博主即可阅读全文 

芒果Cake
关注

4


52


6

专栏目录
HTML+JS+CSS做的一些页面小游戏源码合集.zip
05-09
HTML+JS+CSS做的一些页面小游戏源码合集 HTML+JS+CSS做的一些页面小游戏源码合集 HTML+JS+CSS做的一些页面小游戏源码合集 HTML+JS+CSS做的一些页面小游戏源码合集 HTML+JS+CSS做的一些页面小游戏源码...
飞机大战游戏(html+css3+js)
11-06
技术采用html,css3,js,编写出来的一个小游戏,适合前端初学者。
————————————————
版权声明:本文为CSDN博主「芒果Cake」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/huangwfu/article/details/128458321

  • 17
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值