<script>
/*
* 分析: 食物 , 小蛇 , 游戏 ,三个对象
* */
//一:食物对象
((function () {
//创建一个空数组,保存每一个小方块,方便删除小方块
var elements = [];
//首先要通过构造函数创建对象 属性
function Food(width, height, color, x, y) {
this.width = width || 20;
this.height = height || 20;
this.color = color || "green";
this.x = x || 0;
this.y = y || 0;
}
//创建原型对象来添加方法-->把食物显示在地图上
Food.prototype.init = function (map) {
//先调用删除的封装函数, 先删除再创建
remove();
//1.创建一个小盒子,用来存储食物
var div = document.createElement("div");
//2.吧div添加到map中
map.appendChild(div);
//3.设置样式
div.style.width = this.width + "px";
div.style.height = this.height + "px";
div.style.backgroundColor = this.color;
div.style.position = "absolute";
//div的位置要随机生成
this.x = parseInt(Math.random() * (map.offsetWidth / this.width)) * this.width;
this.y = parseInt(Math.random() * (map.offsetHeight / this.height)) * this.height;
div.style.left = this.x + "px";
div.style.top = this.y + "px";
//把div添加到数值中去
elements.push(div);
}
//封装一个删除食物的函数
function remove() {
for (var i = 0; i < elements.length; i++) {
//获取每一个小方块
var ele = elements[i]
//删除map中的小方块-->通过父元素删掉子元素
ele.parentElement.removeChild(ele);
//删除数组中的小方块
elements.splice(i, 1);
}
}
//把这个构造函数
贪吃蛇全代码
最新推荐文章于 2024-08-11 22:50:14 发布
本文详细介绍了如何从零开始编写贪吃蛇游戏的全程代码,涵盖了游戏逻辑、用户交互和屏幕绘制等核心部分,适合初级程序员学习和实践。
摘要由CSDN通过智能技术生成