近期学习js，假期无事，参照网上的代码写了个双人玩的贪吃蛇。
对网上的代码作了些改造,具体如下：
1，把m*n的二维数组变成m*n一维数组，映射关系为：
A[r]------>a[i][j];
i = r%m;
j = (r-r%m)/m;
j<n;
2，对随机数的获取作了些改造，
3，蛇尾总是第一个加入的元素，
代码编写仓促，也没写注释，望各位见谅
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>snake</title>
<script type='text/javascript' >
(function(){
if (!window.Snake)
window.Snake = {};
Snake = function(container, name){
this.container = container;
this.name = '_' + name + '_';
this.dir = 0;
this.testDir = 0;
this.head = -1;
this.run = 0;
this.speed=300;
this.count={};
if (typeof Snake.prototype._init == 'undefined') {
Snake.prototype.control = function(n){
if (Math.abs(this.testDir) == Math.abs(n))
return;
this.dir = n;
};
Snake.prototype.move = function(){
if (this.container.win) {
clearInterval(this.run);
return;
}
var _left = this.head % this.container.width;
var _top = (this.head - this.head % this.container.width) / this.container.width;
this.dir % this.container.width == 0 ? _top += this.dir / this.container.width : _left += this.dir;
if (_left < 0 || _left >= this.container.width || _top < 0 || _top >= this.container.height || (this.container.all[this.head + this.dir] && this.container.all[this.head + this.dir].indexOf(this.name) != -1)) {
this.container.win = true;
alert(this.name+' lose ~_~');
return;
}
if (!this.container.all[this.head + this.dir]) {
this.container.all[this.head + this.dir] = this.name;
var _div = this.getDivByClass(this.name)[0];
this.container.all[parseInt(_div.style.left) / 20 + parseInt(_div.style.top) / 20 * this.container.width] = this.container.all[parseInt(_div.style.left) / 20 + parseInt(_div.style.top) / 20 * this.container.width].replace(this.name, '');
_div.style.left = _left * 20 + 'px';
_div.style.top = _top * 20 + 'px';
this.container.div.appendChild(_div);
}
else
if (this.head + this.dir == this.container.food) {
var _div = this.getDivByClass(this.container.foodClass)[0];
_div.className = this.name;
this.container.div.appendChild(_div);
this.container.createFood();
this.container.all[this.head + this.dir] = this.name;
}
else {
var _str = this.container.all[this.head + this.dir];
var _divs = this.getDivByClass(_str);
var _div = _divs[0];
if (_divs.length > 1 && parseInt(_div.style.left) / 20 + parseInt(_div.style.top) / 20 * this.container.width == this.head + this.dir) {
this.container.all[this.head + this.dir] = this.name;
_div.className = this.name;
this.container.div.appendChild(_div);
}
else {
this.container.all[this.head + this.dir] += this.name;
var _div = this.getDivByClass(this.name)[0];
this.container.all[parseInt(_div.style.left) / 20 + parseInt(_div.style.top) / 20 * this.container.width] = this.container.all[parseInt(_div.style.left) / 20 + parseInt(_div.style.top) / 20 * this.container.width].replace(this.name, '');
_div.style.left = _left * 20 + 'px';
_div.style.top = _top * 20 + 'px';
this.container.div.appendChild(_div);
}
}
var lth=this.getDivByClass(this.name).length
if(lth>=this.container.bet){
this.container.win=true;
alert(this.name+' win ^-^');
}
this.count.innerHTML=this.name+': '+lth.toString();
this.head += this.dir;
this.testDir = this.dir;
};
Snake.prototype.getDivByClass = function(name){
var _divs = this.container.div.getElementsByTagName('DIV');
var _result = [];
for (var i = 0; i < _divs.length; i++) {
if (_divs[i].className == name)
_result.push(_divs[i]);
}
return _result;
};
Snake.prototype.acc=function(n){
return this.speed+n>50? this.speed+n:this.speed;
}
Snake.prototype.init = function(){
this.head = this.container.getRandom();
this.container.all[this.head] = this.name;
var _left = this.head % this.container.width * 20 + 'px';
var _top = (this.head - this.head % this.container.width) / this.container.width * 20 + 'px';
var _div = document.createElement('DIV');
_div.className = this.name;
_div.style.left = _left;
_div.style.top = _top;
this.count=document.createElement('P');
this.count.innerHTML=this.name+': 1';
this.container.counts.push(this.count);
this.container.div.appendChild(_div);
}
}
Snake.prototype._init = true;
}
if (!window.Container)
window.Container = {};
Container = function(width, height, foodClass, bet){
this.width = width;
this.height = height;
this.food = -1;
this.foodClass = '_' + foodClass + '_';
this.bet = bet;
this.win = false;
this.all = [];
this.counts=[];
var _div = document.createElement('DIV');
_div.className = 'container';
//_div.style.position = 'absolute';
_div.style.width = this.width * 20 + 'px';
_div.style.height = this.height * 20 + 'px';
this.div = _div;
this.getRandom = function(){
var _remain = [];
for (var i = 0; i < width * height; i++) {
if (this.all[i])
continue;
_remain.push(i);
}
var _index = Math.floor(Math.random() * _remain.length);
return _remain[_index];
}
this.createFood = function(){
var _food = this.getRandom();
this.food = _food;
this.all[_food] = this.foodClass;
var _fDiv = document.createElement('DIV');
_fDiv.className = this.foodClass;
var _left = _food % this.width * 20 + 'px';
var _top = (_food - _food % this.width) / this.width * 20 + 'px';
_fDiv.style.left = _left;
_fDiv.style.top = _top;
this.div.appendChild(_fDiv);
}
}
})();
var container = new Container(30, 30, 'food', 20);
var snakeA = new Snake(container, 'snakeA');
var snakeB = new Snake(container, 'snakeB');
function game(){
container.createFood();
snakeA.init();
snakeB.init();
function allcontrol(e){
e = e || window.event;
var n = e.keyCode;
switch (n) {
case 37:
snakeA.control(-1);
break;
case 38:
snakeA.control(-container.width);
break;
case 39:
snakeA.control(1);
break;
case 40:
snakeA.control(container.width);
break;
case 65:
snakeB.control(-1);
break;
case 87:
snakeB.control(-container.width);
break;
case 68:
snakeB.control(1);
break;
case 83:
snakeB.control(container.width);
break;
case 96:
if(snakeA.run){
clearInterval(snakeA.run);
snakeA.speed=snakeA.acc(-50);
snakeA.run=setInterval('snakeA.move()',snakeA.acc(-50));
}
break;
case 110:
if(snakeA.run){
clearInterval(snakeA.run);
snakeA.speed=snakeA.acc(20);
snakeA.run=setInterval('snakeA.move()',snakeA.acc(50));
}
break;
case 71:
if(snakeB.run){
clearInterval(snakeB.run);
snakeB.speed=snakeB.acc(-20);
snakeB.run=setInterval('snakeB.move()',snakeB.acc(-50));
}
break;
case 72:
if(snakeB.run){
clearInterval(snakeB.run);
snakeB.speed=snakeB.acc(20);
snakeB.run=setInterval('snakeB.move()',snakeB.acc(50));
}
break;
}
if (!snakeA.run && snakeA.dir)
snakeA.run = setInterval('snakeA.move()', 300);
if (!snakeB.run && snakeB.dir)
snakeB.run = setInterval('snakeB.move()', 300);
}
var _wrap=document.createElement('DIV');
_wrap.appendChild(container.counts[1]);
_wrap.appendChild(container.div);
_wrap.appendChild(container.counts[0]);
document.body.appendChild(_wrap);
var des=document.createElement('DIV');
des.style.clear='both';
des.style.position='relative';
des.style.padding='20px';
des.innerHTML='snakeA:键盘上↑↓←→代表方向控制，小键盘上0加速，.减速<br/>snakeB:键盘上A W S D代表方向控制，键盘上G加速，H减速<br/>两条蛇可以相互吃掉对方尾部，先吃到20个食物为赢';
document.body.appendChild(des);
if (document.addEventListener) {
document.addEventListener('keydown', allcontrol, false);
}
else
if (document.attachEvent) {
document.attachEvent('onkeydown', allcontrol);
}
}
window.onload = game;
</script>
<style type='text/css'>
p{
float:left;
margin:10px;
padding:20px;
font-weight:bolder;
border:1px solid #000;
text-align:center;
vertical-align:text-bottom;;
}
.container{
position:relative;
float:left;
margin:10px;
padding:0;
border:1px solid #000;
}
._snakeA_{
position:absolute;
margin:0;
padding:0;
width:20px;
height:20px;
border:1px solid #ccc;
background-color:red;
}
._food_{
position:absolute;
margin:0;
padding:0;
width:20px;
height:20px;
border:1px solid #ccc;
background-color:green;
}
._snakeB_{
position:absolute;
margin:0;
padding:0;
width:20px;
height:20px;
border:1px solid #ccc;
background-color:#2E2E2E;
}
</style>
<script type='text/javascript'>
</script>
</head>
<body >
</body>
</html>
分享到：
相关推荐
双人贪吃蛇源代码 作为一名 IT 行业大师，我将为您生成相关知识点，详细解释标题、描述、标签和部分内容中的知识点。 标题：双人贪吃蛇源代码 双人贪吃蛇源代码是指在计算机程序设计基础课程设计中，设计和实现的...
纯c语言写的双人贪吃蛇小游戏，没有用图形库
【描述】"双人版对战贪吃蛇，可输入获胜所需积分" 揭示了游戏的核心玩法和胜利条件。在这个版本的贪吃蛇游戏中，不再是单人的挑战，而是支持两名玩家同时参与对战。每个玩家控制各自的蛇，通过吃到屏幕上的食物来...
在家无聊,花了两三天用TC写了个双人贪吃蛇游戏.UI很粗糙,但是游戏核心是完整的.玩法很简单:wasd和方向键分别控制两条蛇,吃食物长个子,撞到墙壁或者任何蛇身都会使长度变短.长度变为0的就输. 目前仅在XP下测试通过....
Pygame游戏源代码：网络版双人对战贪吃蛇 包含代码、图片、声音等所有资源，可直接运行 游戏时先运行SnakeServer，启动服务器。在分别运行SnakeP1和SnakeP2启动两个客户端。服务器和两个客户端的IP可在源代码中直接...
该源代码为C语言双人/单人贪吃蛇 编译软件WIN-TC 操作系统WINDOWS XP SP3 有单人双人模式选择 开场动画 分数统计 随机障碍 速度变换 但是由于我的操作系统中delay（）的控制单位不是MS 所以在源代码中进行了一定的...
【贪吃蛇游戏双人对战版C语言实现详解】 贪吃蛇游戏是一款经典且深受玩家喜爱的小游戏，它的核心机制简单，但富有挑战性。本项目是基于C语言实现的双人对战版本，旨在让玩家体验到更加互动和竞技的乐趣。下面将详细...
【描述】"双人贪吃蛇，两只贪吃蛇中吃的多并且不触碰到自己的身体和对方的身体以及障碍物的为赢家" 描述了游戏的核心玩法。游戏中有两只或更多的贪吃蛇同时竞技，每条蛇通过吃掉地图上的食物来增长身体长度。玩家...
在本资源中，我们有一个名为"双人版贪吃蛇+C源码"的项目，它提供了实现双人同屏对战贪吃蛇的C语言源代码。这个版本的贪吃蛇在Visual Studio（VS）环境下运行，因此需要安装图形库来支持游戏的图形界面。 首先，要...
在本项目中，"贪吃蛇双人对战版.zip"是一个包含源代码的压缩包，主要用于展示如何使用JavaScript和jQuery实现一个双人对战的贪吃蛇游戏。这是一个非常适合初学者深入理解这两种技术的实践案例。以下是关于JavaScript...
【标题】"双人对战Java贪吃蛇"是一个基于Java编程语言开发的多人互动游戏，它将经典的单人贪吃蛇游戏扩展为双人竞技模式。在这个版本中，两个玩家可以同时参与游戏，分别从屏幕的上下两端开始，目标是在游戏区域内吃...
"双人贪吃蛇"是一款基于经典游戏"贪吃蛇"改编而来的两人对战版本。这款游戏由作者在TC 3.0（Turbo C++ 3.0）环境下编译完成，是一款早期的C++编程实践作品。由于TC 3.0是一个较老的集成开发环境，因此在Windows 7及...
" 是贪吃蛇游戏的英文名，而 "双人贪吃蛇" 和 "贪吃蛇双人" 是对游戏模式的中文描述，意味着玩家可以与朋友一起玩，享受合作或竞争的乐趣。 【描述】"双人贪吃蛇，可以使用。123456789" 说明游戏已经准备就绪，可以...
【双人版贪吃蛇】是一款基于Linux环境并利用Qt界面库开发的创新性小游戏，它将经典单人贪吃蛇游戏升级为可供两人同时竞技的版本，增加了游戏的互动性和趣味性。在这个版本中，两位玩家可以在同一界面上操控各自的...
c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇...
在本项目中，"C语言实现双人版贪吃蛇（图形界面）"是一个具有教育意义的编程实践，它展示了如何使用C语言构建一个简单的双人游戏——贪吃蛇。贪吃蛇是一款经典的游戏，玩家控制一条蛇在有限的空间内移动，通过吃食物...
【C# 双人贪吃蛇游戏开发详解】 在编程世界中，贪吃蛇游戏作为经典的小型游戏，常被用作学习编程语言的基础练习。本项目是基于C#开发的双人贪吃蛇游戏，它允许两位玩家在同一场景下进行实时对战，增加了游戏的互动...
在本项目中，我们探讨的是一个基于C语言实现的贪吃蛇游戏的双人对战版本。这个项目不仅提供了一种单人模式的传统贪吃蛇游戏体验，还引入了多人竞技的元素，允许两个玩家在同一台设备上进行对战。下面我们将详细分析...
c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇游戏的双人对战版c语言贪吃蛇...