被人说搞c/c++,py的不会玩js

版权声明: https://blog.csdn.net/dashoumeixi/article/details/89076238

被人说搞c/c++,py的不会玩js. 

???????????????????????

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">

			(function(){
				var allFoods = [] ;
				function RandomNum(){
				}
				RandomNum.getRange = function (min,max){
					return Math.floor(Math.random() *(max-min) +min);
				} 
				function removeAll(){
					for ( var i = 0 ;allFoods.length;){
						var parent = allFoods[i].parentNode;
						parent.removeChild(allFoods[i]);
						allFoods.splice(i,1);
					}
				}
				 
				function FoodObject(x,y,width,height,color){
					this.width = width ||20;
					this.height = height || 20;
					this.color = color || "aqua";
					this.x = x ||0;
					this.y = y ||0;
				}
				
				FoodObject.prototype.draw = function(map){
					removeAll();
					var div = document.createElement("div");
					this.div  = div;
					allFoods.push(div);
					map.appendChild(div);
					div.style.width  = this.width +"px";
					div.style.height = this.height +"px";
					div.style.backgroundColor = this.color ;
					this.x = RandomNum.getRange(0,map.offsetWidth/this.width) *this.width;
					this.y = RandomNum.getRange(0,map.offsetHeight/this.height) * this.height;
					div.style.left  = this.x +"px";
					div.style.top =  this.y + "px";
					div.style.position = "absolute";
					div.style.borderRadius = "50%"
				}
				
				window.FoodObject = FoodObject;
			})();
			
			(function(){
				var arr = [];
				function SnakeObject(width,height,dir){
					this.width = width ||20;
					this.height = height || 20;
					this.dir = dir || "right";
					this.body =[
						{x:3,y:2,color:"black"},
						{x:2,y:2,color:"white"},
						{x:1,y:2,color:"white"}
					];
					document.addEventListener("keydown",keyEvents.bind(this),false);
				} 
				function keyEvents(e){
					switch(e.keyCode){
						case 38:this.dir = "top";break;
	 					case 39:this.dir = "right";break;
						case 40:this.dir = "down";break;
						case 37:this.dir = "left";break;
					}
				}
				 
				SnakeObject.prototype.draw = function(map){
					this.removeSelf(); 
					for ( var i = 0; i < this.body.length; ++i){
						var div = document.createElement("div");
						map.appendChild(div);
						div.style.position  = "absolute";
						div.style.width = this.width +'px';
						div.style.height = this.height +'px';
						var part = this.body[i];
						div.style.left = part.x *this.width  +"px";
						div.style.top = part.y*this.height + 'px';
						div.style.backgroundColor = part.color;
						div.style.borderRadius = "50%"
						arr.push(div);
						
					}
				}
				SnakeObject.prototype.moveBody = function(map,food,speed){
					for( var last = this.body.length-1 ;  last >0; --last){
						this.body[last].x = this.body[last-1].x;
						this.body[last].y = this.body[last-1].y;
					}
					
					speed = speed ||1;
					switch(this.dir){
						case "left": this.body[0].x -=speed ;break;
						case "right": this.body[0].x +=speed ;break;
						case "top": this.body[0].y -=speed ;break;
						case "down": this.body[0].y +=speed ;break;
					}
					var x = this.body[0].x * this.width;
					var y = this.body[0].y * this.height;
					if( x == food.x  && y == food.y){
						food.draw(map);
						var lastOne = this.body[this.body.length-1];
						var tail = {};
						tail.x = lastOne.x;
						tail.y = lastOne.y;
						tail.color = lastOne.color;
						this.body.push(tail);
					}
				} 
				SnakeObject.prototype.removeSelf = function(){
					for(var i = 0; arr.length;){
						var parent = arr[i].parentNode
						parent.removeChild(arr[i]);
						arr.splice(i,1);
					}
				}
				window.SnakeObject = SnakeObject; 
				
			}());
			(function(){
				var gameObject = null;
				function game(map){
					this.food = new FoodObject();
					this.snake = new SnakeObject();
					this.map = map;
					gameObject = this;
				}
				game.prototype.start = function(msecs){
					this.food.draw(this.map);
					var timer = window.setInterval(function(){
						gameObject.snake.draw(gameObject.map);
						gameObject.snake.moveBody(gameObject.map,gameObject.food);
						var max_x = map.offsetWidth / gameObject.snake.width;
						var max_y = map.offsetHeight / gameObject.snake.height;
						var header_x = gameObject.snake.body[0].x;
						var header_y = gameObject.snake.body[0].y;
						if(header_x < 0 ||header_x > max_x ||
						header_y <0 ||header_y > max_y){
							clearInterval(timer);
							alert("完蛋!")
						}
						
					},msecs||1000);
				}
				
				window.Game = game;
			})();
			window.onload = function(){
				var map = document.getElementById("map");
				var o = new Game(map);
				o.start(100);
				
			}
			
			
		</script>
		<style type="text/css">
			.map{
				width :900px;
				height :900px;
				background-color: blanchedalmond;
				position: relative;
				
			}
		</style>
	</head>
	<body>
		<div id="map" class="map">
			
		</div>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/dashoumeixi/article/details/89076238