精华内容
下载资源
问答
  • js贪吃蛇源代码 20行js代码实现的贪吃蛇大战?
    2021-06-10 16:56:20

    20行js代码实现的贪吃蛇大战?

    JavaScript制作贪吃蛇游戏代码

    要CSS布局HTML小编今天和大家分享有三个等级,有开始暂停和重新开始,有计分,其余都不需要,不要网蛇的身体:数组 食物:在规定范围内生成的随机数 蛇的身体累加:数组元素个数增加 蛇碰墙死:数组首个元素的x值或y值小于0或者大于地图的宽度活高度 蛇咬自己死:数组首个元素的x值和y值和其他元素值重复 移动速度:在指定的时间内调用移动方法

    05425a2b39162e4d129dc6df2393e7b3.png

    用js做一个贪吃蛇的游戏,,最好有注释

    以前做的一个 部分注释 核心部分由注释 其实就是一个最后一个跟随前面一个位置的算法 .body{width:600px;margin:100px auto;text-align:center;} #main{height:300px;border:1px solid #f00;position:relative;} #main div{width:20px;height:20

    js贪吃蛇如何增加蛇和食物数量;设置食物的毒性;布局就不说了哈,只说功能游戏开始,直接增加个点击事件就行,点击之后,所有代码再开始执行 $("#start").on("click",function(){ // 你的所有代码 }) 结束也同理,点击之后直接把所有布局都删了就行 $("#end").on("click",function(){ document

    如何用javascript写一个贪吃蛇

    你所需要的是“贪食蛇的算法”,就是程序设计的概要分析~ 呵呵,其实你去百度上搜索“贪食蛇的算法”就可以了~ 有的网站连程序流程图都有,你一定会学到很多知识~ 我就不复制给你了,有点欺骗你的感觉~ 如果你认同我的回答。

    百度,google 找一找,应该有的。

    想用js做一个贪吃蛇的背景图小格子怎么做

    js中当贪吃蛇达到一定长度加速的代码怎么写

    获取长度变量的值,判断长度,大于一定长度。

    JavaScript贪吃蛇代码不能动,急CSS布局HTML小编今天和大家分享解

    写了贪吃蛇的代码但是不能动,浏览器也没有报错请问是什么问题?代码如网上不是有人家的贪吃蛇代码么,你要是不会。

    CSS布局HTML小编今天和大家分享『javascript』写贪吃蛇的思路

    更多相关内容
  • 这是一个由前端实现的贪吃蛇源代码,可以直接运行!可以根据需要加以修改哦!欢迎喜欢的朋友们下载!
  • 目录效果源代码 效果 源代码 <!DOCTYPE html> <html> <head> <style> * { box-sizing: border-box; } html, body { background-color: #000; height: 100%; } body { background: ...

    效果

    在这里插入图片描述

    源代码

    <!DOCTYPE html>
    <html>
    <head>
       <style>
         * {
      box-sizing: border-box;
    }
    
    html,
    body {
      background-color: #000;
      height: 100%;
    }
    
    body {
      background: #222;
      background: -webkit-radial-gradient(#333, #111);
      background: radial-gradient(#333, #111);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      color: #fff;
      font: 100%/1.5 sans-serif;
      overflow: hidden;
    }
    
    /*================================================
    
    Score
    
    ================================================*/
    
    .score {
      color: rgba(255, 255, 255, 0.5);
      font-size: 16px;
      font-weight: bold;
      padding-top: 5px;
      text-align: center;
    }
    
    /*================================================
    
    Stage
    
    ================================================*/
    
    .stage {
      bottom: 0;
      left: 0;
      margin: auto;
      position: absolute;
      right: 0;
      top: 0;
      z-index: 2;
    }
    
    /*================================================
    
    Tiles
    
    ================================================*/
    
    .tile {
      background: rgba(0, 0, 0, 0.15);
      position: absolute;
      -webkit-transition-property: background,
        box-shadow,
        opacity,
        -webkit-transform;
      transition-property: background,
        box-shadow,
        opacity,
        -webkit-transform;
      transition-property: background,
        box-shadow,
        opacity,
        transform
      ;
      transition-property:
        background,
        box-shadow,
        opacity,
        transform,
        -webkit-transform;
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      -webkit-transition-duration: 3000ms;
              transition-duration: 3000ms;
    }
    
    .tile:before {
      bottom: 0;
      content: '';
      height: 0;
      left: 0;
      margin: auto;
      opacity: 0;
      position: absolute;
      right: 0;
      top: 0;
      width: 0;
      -webkit-transition: opacity 300ms;
      transition: opacity 300ms;
    }
    
    .tile.path:before {
      opacity: 1;
    }
    
    .tile.up:before {
      border-bottom: 4px inset rgba(255, 255, 255, 0.15);
      border-left: 4px solid transparent;
      border-right: 4px solid transparent;
    }
    
    .tile.down:before {
      border-top: 4px inset rgba(255, 255, 255, 0.15);
      border-left: 4px solid transparent;
      border-right: 4px solid transparent;
    }
    
    .tile.left:before { 
      border-right: 4px inset rgba(255, 255, 255, 0.15);
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent;
    }
    
    .tile.right:before { 
      border-left: 4px inset rgba(255, 255, 255, 0.15);
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent;
    }
    
    @media (max-width: 900px), (max-height: 900px) {
      .tile.up:before,
      .tile.down:before,
      .tile.left:before,
      .tile.right:before {
        border-width: 3px;
      }
    }
    
    @media (max-width: 500px), (max-height: 500px) {
      .tile.up:before,
      .tile.down:before,
      .tile.left:before,
      .tile.right:before {
        border-width: 2px;
      }
    }
    
    .tile.pressed {
      background: rgba(0, 0, 0, 0.3);
      box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.6);
      -webkit-transition-duration: 0ms;
              transition-duration: 0ms;
    }
      </style>
    </head>
    <body>
      <div class="score">0</div>
      <div class="stage"></div>
      <script>
      /*================================================
    
    Polyfill
    
    ================================================*/
    
    (function(){ 'use strict';
    
      /*================================================
    
      Request Animation Frame
    
      ================================================*/
      
      var lastTime = 0;
      var vendors = [ 'webkit', 'moz' ];
      for( var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x ) {
        window.requestAnimationFrame = window[ vendors[ x ] + 'RequestAnimationFrame' ];
        window.cancelAnimationFrame = window[ vendors[ x ] + 'CancelAnimationFrame' ] || window[ vendors[ x ] + 'CancelRequestAnimationFrame' ];
      }
    
      if( !window.requestAnimationFrame ) {
        window.requestAnimationFrame = function( callback, element ) {
          var currTime = new Date().getTime();
          var timeToCall = Math.max( 0, 16 - ( currTime - lastTime ) );
          var id = window.setTimeout(
            function() { 
              callback( currTime + timeToCall ); 
            }, timeToCall );
          lastTime = currTime + timeToCall;
          return id;
        }
      }
    
      if( !window.cancelAnimationFrame ) {
        window.cancelAnimationFrame = function( id ) {
          clearTimeout( id );
        }
      }
    
    })();
    
    /*================================================
    
    DOM Manipulation
    
    ================================================*/
    
    (function(){ 'use strict';
    
      function hasClass( elem, className ) {
        return new RegExp( ' ' + className + ' ' ).test( ' ' + elem.className + ' ' );
      };
    
      function addClass( elem, className ) {
        if( !hasClass(elem, className ) ) {
          elem.className += ' ' + className;
        }
      };
    
      function removeClass( elem, className ) {
        var newClass = ' ' + elem.className.replace( /[\t\r\n]/g, ' ' ) + ' ';
        if( hasClass( elem, className ) ) {
          while( newClass.indexOf(' ' + className + ' ' ) >= 0 ) {
            newClass = newClass.replace( ' ' + className + ' ', ' ' );
          }
          elem.className = newClass.replace( /^\s+|\s+$/g, '' );
        }
      };
    
      function toggleClass( elem, className ) {
        var newClass = ' ' + elem.className.replace( /[\t\r\n]/g, ' ' ) + ' ';
        if( hasClass(elem, className ) ) {
          while( newClass.indexOf( ' ' + className + ' ' ) >= 0 ) {
            newClass = newClass.replace( ' ' + className + ' ' , ' ' );
          }
          elem.className = newClass.replace( /^\s+|\s+$/g, '' );
        } else {
          elem.className += ' ' + className;
        }
      };
    
    })();
    
    /*================================================
    
    Core
    
    ================================================*/
    
    g = {};
    
    (function(){ 'use strict';
    
      /*================================================
    
      Math
    
      ================================================*/
    
      g.m = Math;
      g.mathProps = 'E LN10 LN2 LOG2E LOG10E PI SQRT1_2 SQRT2 abs acos asin atan ceil cos exp floor log round sin sqrt tan atan2 pow max min'.split( ' ' );
      for ( var i = 0; i < g.mathProps.length; i++ ) {
        g[ g.mathProps[ i ] ] = g.m[ g.mathProps[ i ] ];
      }
      g.m.TWO_PI = g.m.PI * 2;
    
      /*================================================
    
      Miscellaneous
    
      ================================================*/
    
      g.isset = function( prop ) {
        return typeof prop != 'undefined';
      };
    
      g.log = function() {
        if( g.isset( g.config ) && g.config.debug && window.console ){
          console.log( Array.prototype.slice.call( arguments ) );
        }
      };
    
    })();
    
    /*================================================
    
    Group
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.Group = function() {
        this.collection = [];
        this.length = 0;
      };
    
      g.Group.prototype.add = function( item ) {
        this.collection.push( item );
        this.length++;
      };
    
      g.Group.prototype.remove = function( index ) {
        if( index < this.length ) {
          this.collection.splice( index, 1 );
          this.length--;
        }
      };
    
      g.Group.prototype.empty = function() {
        this.collection.length = 0;
        this.length = 0;
      };
    
      g.Group.prototype.each = function( action, asc ) {
        var asc = asc || 0,
          i;
        if( asc ) {
          for( i = 0; i < this.length; i++ ) {
            this.collection[ i ][ action ]( i );
          }
        } else {
          i = this.length;
          while( i-- ) {
            this.collection[ i ][ action ]( i );
          }
        }
      };
    
    })();
    
    /*================================================
    
    Utilities
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.util = {};
    
      /*================================================
    
      Random
    
      ================================================*/
      
      g.util.rand = function( min, max ) {
        return g.m.random() * ( max - min ) + min;
      };
    
      g.util.randInt = function( min, max ) {
        return g.m.floor( g.m.random() * ( max - min + 1) ) + min;
      };
    
    }());
    
    /*================================================
    
    State
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.states = {};
    
      g.addState = function( state ) {
        g.states[ state.name ] = state;
      };
    
      g.setState = function( name ) {
        if( g.state ) {
          g.states[ g.state ].exit();
        }
        g.state = name;
        g.states[ g.state ].init();
      };
    
      g.currentState = function() {
        return g.states[ g.state ];
      };
    
    }());
    
    /*================================================
    
    Time
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.Time = function() {
        this.reset();
      }
    
      g.Time.prototype.reset = function() {
        this.now = Date.now();
        this.last = Date.now();
        this.delta = 60;
        this.ndelta = 1;
        this.elapsed = 0;
        this.nelapsed = 0;
        this.tick = 0;
      };
    
      g.Time.prototype.update = function() {
        this.now = Date.now();
        this.delta = this.now - this.last;
        this.ndelta = Math.min( Math.max( this.delta / ( 1000 / 60 ), 0.0001 ), 10 );
        this.elapsed += this.delta;
        this.nelapsed += this.ndelta;
        this.last = this.now;
        this.tick++;
      };
    
    })();
    
    /*================================================
    
    Grid Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.Grid = function( cols, rows ) {
        this.cols = cols;
        this.rows = rows;
        this.tiles = [];
        for( var x = 0; x < cols; x++ ) {
          this.tiles[ x ] = [];
          for( var y = 0; y < rows; y++ ) {
            this.tiles[ x ].push( 'empty' );
          }
        }
      };
    
      g.Grid.prototype.get = function( x, y ) {
        return this.tiles[ x ][ y ];
      };
    
      g.Grid.prototype.set = function( x, y, val ) {
        this.tiles[ x ][ y ] = val;
      };
    
    })();
    
    /*================================================
    
    Board Tile Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.BoardTile = function( opt ) {
        this.parentState = opt.parentState;
        this.parentGroup = opt.parentGroup;
        this.col = opt.col;
        this.row = opt.row;
        this.x = opt.x;
        this.y = opt.y;
        this.z = 0;
        this.w = opt.w;
        this.h = opt.h;
        this.elem = document.createElement( 'div' );
        this.elem.style.position = 'absolute';
        this.elem.className = 'tile';
        this.parentState.stageElem.appendChild( this.elem );
        this.classes = {
          pressed: 0,
          path: 0,
          up: 0,
          down: 0,
          left: 0,
          right: 0
        }
        this.updateDimensions();
      };
    
      g.BoardTile.prototype.update = function() {
        for( var k in this.classes ) {
          if( this.classes[ k ] ) {
            this.classes[ k ]--;
          }
        }
    
        if( this.parentState.food.tile.col == this.col || this.parentState.food.tile.row == this.row ) {
          this.classes.path = 1;
          if( this.col < this.parentState.food.tile.col ) {
            this.classes.right = 1;
          } else {
            this.classes.right = 0;
          }
          if( this.col > this.parentState.food.tile.col ) {
            this.classes.left = 1;
          } else {
            this.classes.left = 0;
          }
          if( this.row > this.parentState.food.tile.row ) {
            this.classes.up = 1;
          } else {
            this.classes.up = 0;
          }
          if( this.row < this.parentState.food.tile.row ) {
            this.classes.down = 1;
          } else {
            this.classes.down = 0;
          }
        } else {
          this.classes.path = 0;
        }
    
        if( this.parentState.food.eaten ) {
          this.classes.path = 0;
        }
      };
    
      g.BoardTile.prototype.updateDimensions = function() {
        this.x = this.col * this.parentState.tileWidth;
        this.y = this.row * this.parentState.tileHeight;
        this.w = this.parentState.tileWidth - this.parentState.spacing;
        this.h = this.parentState.tileHeight - this.parentState.spacing;
        this.elem.style.left = this.x + 'px';
        this.elem.style.top = this.y + 'px';
        this.elem.style.width = this.w + 'px';
        this.elem.style.height = this.h + 'px';
      };
    
      g.BoardTile.prototype.render = function() {
        var classString = '';
        for( var k in this.classes ) {
          if( this.classes[ k ] ) {
            classString += k + ' ';
          }
        }
        this.elem.className = 'tile ' + classString;
      };
    
    })();
    
    /*================================================
    
    Snake Tile Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.SnakeTile = function( opt ) {
        this.parentState = opt.parentState;
        this.parentGroup = opt.parentGroup;
        this.col = opt.col;
        this.row = opt.row;
        this.x = opt.x;
        this.y = opt.y;
        this.w = opt.w;
        this.h = opt.h;
        this.color = null;
        this.scale = 1;
        this.rotation = 0;
        this.blur = 0;
        this.alpha = 1;
        this.borderRadius = 0;
        this.borderRadiusAmount = 0;
        this.elem = document.createElement( 'div' );
        this.elem.style.position = 'absolute';
        this.parentState.stageElem.appendChild( this.elem );
      };
    
      g.SnakeTile.prototype.update = function( i ) {
        this.x = this.col * this.parentState.tileWidth;
        this.y = this.row * this.parentState.tileHeight;
        if( i == 0 ) {
          this.color = '#fff';
          this.blur = this.parentState.dimAvg * 0.03 + Math.sin( this.parentState.time.elapsed / 200 ) * this.parentState.dimAvg * 0.015;
          if( this.parentState.snake.dir == 'n' ) {
            this.borderRadius = this.borderRadiusAmount + '% ' + this.borderRadiusAmount + '% 0 0';
          } else if( this.parentState.snake.dir == 's' ) {
            this.borderRadius = '0 0 ' + this.borderRadiusAmount + '% ' + this.borderRadiusAmount + '%';
          } else if( this.parentState.snake.dir == 'e' ) {
            this.borderRadius = '0 ' + this.borderRadiusAmount + '% ' + this.borderRadiusAmount + '% 0';
          } else if( this.parentState.snake.dir == 'w' ) {
            this.borderRadius = this.borderRadiusAmount + '% 0 0 ' + this.borderRadiusAmount + '%';
          }
        } else {
          this.color = '#fff';
          this.blur = 0;
          this.borderRadius = '0';
        }
        this.alpha = 1 - ( i / this.parentState.snake.tiles.length ) * 0.6;
        this.rotation = ( this.parentState.snake.justAteTick / this.parentState.snake.justAteTickMax ) * 90;
        this.scale = 1 + ( this.parentState.snake.justAteTick / this.parentState.snake.justAteTickMax ) * 1;
      };
    
      g.SnakeTile.prototype.updateDimensions = function() {
        this.w = this.parentState.tileWidth - this.parentState.spacing;
        this.h = this.parentState.tileHeight - this.parentState.spacing;
      };
    
      g.SnakeTile.prototype.render = function( i ) {
        this.elem.style.left = this.x + 'px';
        this.elem.style.top = this.y + 'px';
        this.elem.style.width = this.w + 'px';
        this.elem.style.height = this.h + 'px';
        this.elem.style.backgroundColor = 'rgba(255, 255, 255, ' + this.alpha + ')';
        this.elem.style.boxShadow = '0 0 ' + this.blur + 'px #fff';
        this.elem.style.borderRadius = this.borderRadius;
      };
    
    })();
    
    /*================================================
    
    Food Tile Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.FoodTile = function( opt ) {
        this.parentState = opt.parentState;
        this.parentGroup = opt.parentGroup;
        this.col = opt.col;
        this.row = opt.row;
        this.x = opt.x;
        this.y = opt.y;
        this.w = opt.w;
        this.h = opt.h;
        this.blur = 0;
        this.scale = 1;
        this.hue = 100;
        this.opacity = 0;
        this.elem = document.createElement( 'div' );
        this.elem.style.position = 'absolute';
        this.parentState.stageElem.appendChild( this.elem );
      };
    
      g.FoodTile.prototype.update = function() {
        this.x = this.col * this.parentState.tileWidth;
        this.y = this.row * this.parentState.tileHeight;
        this.blur = this.parentState.dimAvg * 0.03 + Math.sin( this.parentState.time.elapsed / 200 ) * this.parentState.dimAvg * 0.015;
        this.scale = 0.8 + Math.sin( this.parentState.time.elapsed / 200 ) * 0.2;
    
        if( this.parentState.food.birthTick || this.parentState.food.deathTick ) {
          if( this.parentState.food.birthTick ) {
            this.opacity = 1 - ( this.parentState.food.birthTick / 1 ) * 1;
          } else {
            this.opacity = ( this.parentState.food.deathTick / 1 ) * 1;
          }
        } else {
          this.opacity = 1;
        }
      };
    
      g.FoodTile.prototype.updateDimensions = function() {
        this.w = this.parentState.tileWidth - this.parentState.spacing;
        this.h = this.parentState.tileHeight - this.parentState.spacing;
      };
    
      g.FoodTile.prototype.render = function() {
        this.elem.style.left = this.x + 'px';
        this.elem.style.top = this.y + 'px';
        this.elem.style.width = this.w + 'px';
        this.elem.style.height = this.h + 'px';
        this.elem.style[ 'transform' ] = 'translateZ(0) scale(' + this.scale + ')';
        this.elem.style.backgroundColor = 'hsla(' + this.hue + ', 100%, 60%, 1)';
        this.elem.style.boxShadow = '0 0 ' + this.blur + 'px hsla(' + this.hue + ', 100%, 60%, 1)';
        this.elem.style.opacity = this.opacity;
      };
    
    })();
    
    /*================================================
    
    Snake Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.Snake = function( opt ) {
        this.parentState = opt.parentState;
        this.dir = 'e',
        this.currDir = this.dir;
        this.tiles = [];
        for( var i = 0; i < 5; i++ ) {
          this.tiles.push( new g.SnakeTile({
            parentState: this.parentState,
            parentGroup: this.tiles,
            col: 8 - i,
            row: 3,
            x: ( 8 - i ) * opt.parentState.tileWidth,
            y: 3 * opt.parentState.tileHeight,
            w: opt.parentState.tileWidth - opt.parentState.spacing,
            h: opt.parentState.tileHeight - opt.parentState.spacing
          }));
        }
        this.last = 0;
        this.updateTick = 10;
        this.updateTickMax = this.updateTick;
        this.updateTickLimit = 3;
        this.updateTickChange = 0.2;
        this.deathFlag = 0;
        this.justAteTick = 0;
        this.justAteTickMax = 1;
        this.justAteTickChange = 0.05;
    
        // sync data grid of the play state
        var i = this.tiles.length;
    
        while( i-- ) {
          this.parentState.grid.set( this.tiles[ i ].col, this.tiles[ i ].row, 'snake' );
        }
      };
    
      g.Snake.prototype.updateDimensions = function() {
        var i = this.tiles.length;
        while( i-- ) {
          this.tiles[ i ].updateDimensions();
        }
      };
    
      g.Snake.prototype.update = function() {
        if( this.parentState.keys.up ) {
          if( this.dir != 's' && this.dir != 'n' && this.currDir != 's' && this.currDir != 'n' ) {
            this.dir = 'n';
          }
        } else if( this.parentState.keys.down) {
          if( this.dir != 'n' && this.dir != 's' && this.currDir != 'n' && this.currDir != 's' ) {
            this.dir = 's';
          }
        } else if( this.parentState.keys.right ) {
          if( this.dir != 'w' && this.dir != 'e' && this.currDir != 'w' && this.currDir != 'e' ) {
            this.dir = 'e';
          }
        } else if( this.parentState.keys.left ) {
          if( this.dir != 'e' && this.dir != 'w' && this.currDir != 'e' && this.currDir != 'w' ) {
            this.dir = 'w';
          }
        }
    
        this.parentState.keys.up = 0;
        this.parentState.keys.down = 0;
        this.parentState.keys.right = 0;
        this.parentState.keys.left = 0;
    
        this.updateTick += this.parentState.time.ndelta;
        if( this.updateTick >= this.updateTickMax ) {
          // reset the update timer to 0, or whatever leftover there is
          this.updateTick = ( this.updateTick - this.updateTickMax );
    
          // rotate snake block array
          this.tiles.unshift( new g.SnakeTile({
            parentState: this.parentState,
            parentGroup: this.tiles,
            col: this.tiles[ 0 ].col,
            row: this.tiles[ 0 ].row,
            x: this.tiles[ 0 ].col * this.parentState.tileWidth,
            y: this.tiles[ 0 ].row * this.parentState.tileHeight,
            w: this.parentState.tileWidth - this.parentState.spacing,
            h: this.parentState.tileHeight - this.parentState.spacing
          }));
          this.last = this.tiles.pop();
          this.parentState.stageElem.removeChild( this.last.elem );
    
          this.parentState.boardTiles.collection[ this.last.col + ( this.last.row * this.parentState.cols ) ].classes.pressed = 2;
    
          // sync data grid of the play state
          var i = this.tiles.length;
    
          while( i-- ) {
            this.parentState.grid.set( this.tiles[ i ].col, this.tiles[ i ].row, 'snake' );
          }
          this.parentState.grid.set( this.last.col, this.last.row, 'empty' );
    
    
          // move the snake's head
          if ( this.dir == 'n' ) {
            this.currDir = 'n';
            this.tiles[ 0 ].row -= 1;
          } else if( this.dir == 's' ) {
            this.currDir = 's';
            this.tiles[ 0 ].row += 1;
          } else if( this.dir == 'w' ) {
            this.currDir = 'w';
            this.tiles[ 0 ].col -= 1;
          } else if( this.dir == 'e' ) {
            this.currDir = 'e';
            this.tiles[ 0 ].col += 1;
          }
    
          // wrap walls
          this.wallFlag = false;
          if( this.tiles[ 0 ].col >= this.parentState.cols ) {
            this.tiles[ 0 ].col = 0;
            this.wallFlag = true;
          }
          if( this.tiles[ 0 ].col < 0 ) {
            this.tiles[ 0 ].col = this.parentState.cols - 1;
            this.wallFlag = true;
          }
          if( this.tiles[ 0 ].row >= this.parentState.rows ) {
            this.tiles[ 0 ].row = 0;
            this.wallFlag = true;
          }
          if( this.tiles[ 0 ].row < 0 ) {
            this.tiles[ 0 ].row = this.parentState.rows - 1;
            this.wallFlag = true;
          }
    
          // check death by eating self
          if( this.parentState.grid.get( this.tiles[ 0 ].col, this.tiles[ 0 ].row ) == 'snake' ) {
            this.deathFlag = 1;
            clearTimeout( this.foodCreateTimeout );
          }
    
          // check eating of food
          if( this.parentState.grid.get( this.tiles[ 0 ].col, this.tiles[ 0 ].row ) == 'food' ) {
            this.tiles.push( new g.SnakeTile({
              parentState: this.parentState,
              parentGroup: this.tiles,
              col: this.last.col,
              row: this.last.row,
              x: this.last.col * this.parentState.tileWidth,
              y: this.last.row * this.parentState.tileHeight,
              w: this.parentState.tileWidth - this.parentState.spacing,
              h: this.parentState.tileHeight - this.parentState.spacing
            }));
            if( this.updateTickMax - this.updateTickChange > this.updateTickLimit ) {
              this.updateTickMax -= this.updateTickChange;
            }
            this.parentState.score++;
            this.parentState.scoreElem.innerHTML = this.parentState.score;
            this.justAteTick = this.justAteTickMax;
    
            this.parentState.food.eaten = 1;
            this.parentState.stageElem.removeChild( this.parentState.food.tile.elem );
    
            var _this = this;
            
            this.foodCreateTimeout = setTimeout( function() {
              _this.parentState.food = new g.Food({
                parentState: _this.parentState
              });
            }, 300);
          }
    
          // check death by eating self
          if( this.deathFlag ) {
            g.setState( 'play' );
          }
        }
    
        // update individual snake tiles
        var i = this.tiles.length;
        while( i-- ) {
          this.tiles[ i ].update( i );
        }
    
        if( this.justAteTick > 0 ) {
          this.justAteTick -= this.justAteTickChange;
        } else if( this.justAteTick < 0 ) {
          this.justAteTick = 0;
        }
      };
    
      g.Snake.prototype.render = function() {
        // render individual snake tiles
        var i = this.tiles.length;
        while( i-- ) {
          this.tiles[ i ].render( i );
        }
      };
    
    })();
    
    /*================================================
    
    Food Entity
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.Food = function( opt ) {
        this.parentState = opt.parentState;
        this.tile = new g.FoodTile({
          parentState: this.parentState,
          col: 0,
          row: 0,
          x: 0,
          y: 0,
          w: opt.parentState.tileWidth - opt.parentState.spacing,
          h: opt.parentState.tileHeight - opt.parentState.spacing
        });
        this.reset();
        this.eaten = 0;
        this.birthTick = 1;
        this.deathTick = 0;
        this.birthTickChange = 0.025;
        this.deathTickChange = 0.05;
      };
    
      g.Food.prototype.reset = function() {
        var empty = [];
        for( var x = 0; x < this.parentState.cols; x++) {
          for( var y = 0; y < this.parentState.rows; y++) {
            var tile = this.parentState.grid.get( x, y );
            if( tile == 'empty' ) {
              empty.push( { x: x, y: y } );
            }
          }
        }
        var newTile = empty[ g.util.randInt( 0, empty.length - 1 ) ];
        this.tile.col = newTile.x;
        this.tile.row = newTile.y;
      };
    
      g.Food.prototype.updateDimensions = function() {
        this.tile.updateDimensions();
      };
    
      g.Food.prototype.update = function() {
        // update food tile
        this.tile.update();
    
        if( this.birthTick > 0 ) {
          this.birthTick -= this.birthTickChange;
        } else if( this.birthTick < 0 ) {
          this.birthTick = 0;
        }
    
        // sync data grid of the play state
        this.parentState.grid.set( this.tile.col, this.tile.row, 'food' );
      };
    
      g.Food.prototype.render = function() {
        this.tile.render();
      };
    
    })();
    
    /*================================================
    
    Play State
    
    ================================================*/
    
    (function(){ 'use strict';
    
      function StatePlay() {
        this.name = 'play';
      }
    
      StatePlay.prototype.init = function() {
        this.scoreElem = document.querySelector( '.score' );
        this.stageElem = document.querySelector( '.stage' );
        this.dimLong = 28;
        this.dimShort = 16;
        this.padding = 0.25;
        this.boardTiles = new g.Group();
        this.keys = {};
        this.foodCreateTimeout = null;
        this.score = 0;
        this.scoreElem.innerHTML = this.score;
        this.time = new g.Time();
        this.getDimensions();
        if( this.winWidth < this.winHeight ) {
          this.rows = this.dimLong;
          this.cols = this.dimShort;
        } else {
          this.rows = this.dimShort;
          this.cols = this.dimLong;
        }
        this.spacing = 1;
        this.grid = new g.Grid( this.cols, this.rows );
        this.resize();
        this.createBoardTiles();
        this.bindEvents();
        this.snake = new g.Snake({
          parentState: this
        });
        this.food = new g.Food({
          parentState: this
        });
      };
    
      StatePlay.prototype.getDimensions = function() {
        this.winWidth = window.innerWidth;
        this.winHeight = window.innerHeight;
        this.activeWidth = this.winWidth - ( this.winWidth * this.padding );
        this.activeHeight = this.winHeight - ( this.winHeight * this.padding );
      };
    
      StatePlay.prototype.resize = function() {
        var _this = g.currentState();
    
        _this.getDimensions();
    
        _this.stageRatio = _this.rows / _this.cols;
    
        if( _this.activeWidth > _this.activeHeight / _this.stageRatio ) {
          _this.stageHeight = _this.activeHeight;
          _this.stageElem.style.height = _this.stageHeight + 'px';
          _this.stageWidth = Math.floor( _this.stageHeight /_this.stageRatio );
          _this.stageElem.style.width = _this.stageWidth + 'px';
        } else {
          _this.stageWidth = _this.activeWidth;
          _this.stageElem.style.width = _this.stageWidth + 'px';
          _this.stageHeight = Math.floor( _this.stageWidth * _this.stageRatio );
          _this.stageElem.style.height = _this.stageHeight + 'px';
        }
    
        _this.tileWidth = ~~( _this.stageWidth / _this.cols );
        _this.tileHeight = ~~( _this.stageHeight / _this.rows );
        _this.dimAvg = ( _this.activeWidth + _this.activeHeight ) / 2;
        _this.spacing = Math.max( 1, ~~( _this.dimAvg * 0.0025 ) );
    
        _this.stageElem.style.marginTop = ( -_this.stageElem.offsetHeight / 2 ) + _this.headerHeight / 2 + 'px';
    
        _this.boardTiles.each( 'updateDimensions' );
        _this.snake !== undefined && _this.snake.updateDimensions();
        _this.food !== undefined && _this.food.updateDimensions();
      };
    
      StatePlay.prototype.createBoardTiles = function() {
        for( var y = 0; y < this.rows; y++ ) {
          for( var x = 0; x < this.cols; x++ ) {
            this.boardTiles.add( new g.BoardTile({
              parentState: this,
              parentGroup: this.boardTiles,
              col: x,
              row: y,
              x: x * this.tileWidth,
              y: y * this.tileHeight,
              w: this.tileWidth - this.spacing,
              h: this.tileHeight - this.spacing
            }));
          }
        }
      };
    
      StatePlay.prototype.upOn = function() { g.currentState().keys.up = 1; }
      StatePlay.prototype.downOn = function() { g.currentState().keys.down = 1; }
      StatePlay.prototype.rightOn = function() { g.currentState().keys.right = 1; }
      StatePlay.prototype.leftOn = function() { g.currentState().keys.left = 1; }
      StatePlay.prototype.upOff = function() { g.currentState().keys.up = 0; }
      StatePlay.prototype.downOff = function() { g.currentState().keys.down = 0; }
      StatePlay.prototype.rightOff = function() { g.currentState().keys.right = 0; }
      StatePlay.prototype.leftOff = function() { g.currentState().keys.left = 0; }
    
      StatePlay.prototype.keydown = function( e ) {
        e.preventDefault();
        var e = ( e.keyCode ? e.keyCode : e.which ),
          _this = g.currentState();
        if( e === 38 || e === 87 ) { _this.upOn(); }
        if( e === 39 || e === 68 ) { _this.rightOn(); }
        if( e === 40 || e === 83 ) { _this.downOn(); }
        if( e === 37 || e === 65 ) { _this.leftOn(); }
      };
    
      StatePlay.prototype.bindEvents = function() {
        var _this = g.currentState();
        window.addEventListener( 'keydown', _this.keydown, false );
        window.addEventListener( 'resize', _this.resize, false );
      };
    
      StatePlay.prototype.step = function() {
        this.boardTiles.each( 'update' );
        this.boardTiles.each( 'render' );
        this.snake.update();
        this.snake.render();
        this.food.update();
        this.food.render();
        this.time.update();
      };
    
      StatePlay.prototype.exit = function() {
        window.removeEventListener( 'keydown', this.keydown, false );
        window.removeEventListener( 'resize', this.resize, false );
        this.stageElem.innerHTML = '';
        this.grid.tiles = null;
        this.time = null;
      };
    
      g.addState( new StatePlay() );
    
    })();
    
    /*================================================
    
    Game
    
    ================================================*/
    
    (function(){ 'use strict';
    
      g.config = {
        title: 'Snakely',
        debug: window.location.hash == '#debug' ? 1 : 0,
        state: 'play'
      };
    
      g.setState( g.config.state );
    
      g.time = new g.Time();
    
      g.step = function() {
        requestAnimationFrame( g.step );
        g.states[ g.state ].step();
        g.time.update();
      };
    
      window.addEventListener( 'load', g.step, false );
    
    })();</script>
    </body>
    </html>```
    
    展开全文
  • 贪吃蛇html游戏代码

    千次阅读 2022-03-23 14:00:30
    贪吃蛇html游戏代码 拿来即用! 代码如下 <!DOCTYPE html> html> <head> <meta charset="UTF-8"> 贪吃蛇</title> <style> #map { width: 400px; height: 400px;...................

    拿来即用!

    1代码如下

    <!DOCTYPE html>
    <html>
     
    	<head>
    		<meta charset="UTF-8">
    		<title>贪吃蛇</title>
    		<style>
    			#map {
    				width: 400px;
    				height: 400px;
    				border: 1px solid black;
    			}
    			/*地图的样式*/
    			
    			.divMap {
    				width: 18px;
    				height: 18px;
    				margin: 1px;
    				background-color: yellow;
    				float: left;
    			}
    			/*//蛇身的样式*/
    			
    			.divSnake {
    				width: 18px;
    				height: 18px;
    				margin: 1px;
    				background-color: red;
    				float: left;
    			}
    			/*//食物的样式*/
    			
    			.divFood {
    				width: 18px;
    				height: 18px;
    				margin: 1px;
    				background-color: green;
    				float: left;
    			}
    		</style>
    		<script>
    			var mapX = 20,
    				mapY = 20; //地图边界,横向和纵向的div小格数量
    			var arrMap = new Array(); //地图数组
    			var snakeX = [4, 5, 6],
    				snakeY = [2, 2, 2]; //蛇身
    			var foodX = 9,
    				foodY = 3; //食物
    			var keyCode = 39; //蛇身移动方向,默认向右
    			//创建地图
    			function createMap() {
    				var map = document.getElementById("map");
    				for(y = 0; y < mapY; y++) {
    					//第一层循环,y表示纵向轴
    					arrMap[y] = new Array();
    					for(x = 0; x < mapX; x++) {
    						//第二层循环,x表示横向轴
    						var div = document.createElement("div"); //div小格
    						div.className = "divMap"; //初始化样式
    						arrMap[y][x] = div; //将小格放入地图数组
    						map.appendChild(div); //页面绘制
    					}
    				}
    			}
     
    			//创建蛇身 
    			function createSnake() {
    				var result; //判斷是否需要重新生成食物
    				//改变地图中一串连续的div的底色
    				for(i = 0; i < snakeX.length; i++) {
    					arrMap[snakeY[i]][snakeX[i]].className = "divSnake";
     
    				}
    			}
     
    			//创建食物
    			function createFood() {
    				result = false;
    				do {
    					foodX = parseInt(Math.random() * mapX);
    					foodY = parseInt(Math.random() * mapY);
    					//判断食物不能出现在蛇身上
    					for(i = 0; i < snakeX.length; i++) {
    						if(snakeX[i] == foodX && snakeY[i] == foodY) {
    							result = true; //重叠了,需要从新生成一个食物
    							break;
    						}
     
    					}
    				} while (result);
     
    				arrMap[foodY][foodX].className = "divFood"
    			}
     
    			//清除蛇身
    			function claerSnake() {
    				for(i = 0; i < snakeX.length; i++) {
    					arrMap[snakeY[i]][snakeX[i]].className = "divMap";
    				}
    			}
     
    			//蛇身运动
    			function snakeMove() {
    				//清除蛇身
    				claerSnake();
     
    				for(i = 0; i < snakeX.length - 1; i++) {
    					snakeX[i] = snakeX[i + 1];
    					snakeY[i] = snakeY[i + 1];
     
    				}
     
    				//				snakeX[snakeX.length - 1]++; //向右移动
    				//每次移动。舌头增加1格,keyCode匹配键盘方向键
    				switch(keyCode) {
    					case 37: //向右
    						snakeX[snakeX.length - 1]--;
    						break;
    					case 38: //向上
    						snakeY[snakeY.length - 1]--;
    						break;
    					case 39: //向右
    						snakeX[snakeX.length - 1]++;
    						break;
    					case 40: //向上
    						snakeY[snakeY.length - 1]++;
    						break;
    				}
     
    				//吃掉食物
    				if(snakeX[snakeX.length - 1] == foodX && snakeY[snakeY.length - 1] == foodY) {
    					//吃到食物
    					snakeX[snakeX.length] = snakeX[snakeX.length - 1];
    					snakeY[snakeY.length] = snakeY[snakeY.length - 1];
    					//重新排列
    					for(i = snakeX.length - 1; i > 0; i--) {
    						snakeX[i] = snakeX[i - 1];
    						snakeY[i] = snakeY[i - 1];
    					}
    					createFood(); //重新生成下一個食物
     
    				}
    				//超出游戲邊框
    				if(snakeX[snakeX.length - 1] < 0 ||
    					snakeX[snakeX.length - 1] > mapX - 1 ||
    					snakeY[snakeY.length - 1] < 0 ||
    					snakeY[snakeY.length - 1] > mapY - 1) {
    					clearInterval(move); //停止移動
    					alert("游戲結束");
    					return;
    				}
     
    				createSnake(); //创建蛇身
    			}
     
    			function keyDown() {
    				var newKey = event.keyCode; //键盘按键
    				if(keyCode == 37 && newKey == 39 ||
    					keyCode == 39 && newKey == 37 ||
    					keyCode == 38 && newKey == 40 ||
    					keyCode == 40 && newKey == 38
    				) {
    					//禁止掉头
    					return;
    				} else if(newKey >= 37 && newKey <= 40) {
    					//用户按了某个方向键
    					keyCode = newKey;
    				} else {
    					//其他按键
    				}
     
    			}
    			//运行
    			window.onload = function() {
    				createMap(); //创建地图
    				createSnake(); //蛇身
    				createFood(); //创建食物
    				move = setInterval("snakeMove()", 200); //每个两百秒蛇身移动
    				document.onkeydown = keyDown; //捕获方向键
    			}
    		</script>
    	</head>
     
    	<body>
    		<div id="map"></div>
    	</body>
     
    </html>

    2效果

    展开全文
  • 游戏难点是怎么模拟贪吃蛇的移动。如果只是一个方块的话显然很简单。但是当蛇的长度变长之后要怎么样控制,下面为大家简要介绍下具体的实现,感兴趣的朋友可以参考下,希望对大家有所帮助
  • 简易贪吃蛇游戏代码是一款基于js跟html5封装的贪吃蛇,同时添加了css3颜色特效和背景图片,适合初级编程者学习。
  • JavaScript版贪吃蛇游戏,网页小游戏代码分享,这类小游戏可以很好的用JS来实现,游戏速度由快、中、慢可选,按“空格键” 开始/暂停,方向键控制蛇身运动方向,若要想研究代码原理,可关注代码中的注释,写的非常好...
  • 贪吃蛇源代码

    2017-03-18 17:01:59
    第一次写游戏,第一次写html5 感觉还是很吃力的。写完了,给大家分享下。互相交流.不懂的或者有建议的,可以留言给我。代码很短,就60行
  • js 贪吃蛇 代码源文件

    2017-09-09 11:11:49
    使用canvas 和js实现的不到100行的代码。 学习js时候个人做的贪吃蛇的小游戏,可以供大家参考。 。。。。。。。。。。。。。。
  • 源码实现html贪吃蛇

    千次阅读 2019-04-16 10:05:21
    HTML贪吃蛇源码实现 这段代码用到了jQuery, 注意代码里面引入的外部jQuery.jsp,可以自行去官网下载。 效果: 操作:上下左右键控制方向 源码: <!DOCTYPE html> <html> <head> <...

    HTML贪吃蛇源码实现

    这段代码用到了jQuery, 注意代码里面引入的外部jQuery.js,可以自行去官网下载。

    效果:

    在这里插入图片描述
    操作:上下左右键控制方向
    源码:

    <!DOCTYPE html>
    <html>
     <head>
      <meta charset="utf-8">
      <title></title>
      <style>
       .div1{
        height:600px;
        width:900px;
        border:solid;
        background:green;
       }
       .snake{
        height:10px;
        width:10px;
        position: fixed; 
        top:100px;
        left:100px;
        border:solid;
        background:black;
       }
       .food{
        height:10px;
        width:10px;
        position: fixed;
        top:300px;
        left:400px;
        background:red;
       }
      </style>
      <script src="jquery-3.2.1.js"></script>
      <script>
       $(function(){
        var count=1;
        var sm=2000;//初始时速
        var extent=100;//初始长度
        function food(){//随机坐标产生食物
         while(true){
          let num1 = Math.floor(Math.random()*900);
          let num2 = Math.floor(Math.random()*600);
          if(num1>13 && num2>20){
           $("#food").offset({top:num2,left:num1});
           break;
          } 
         }
        }
        
        function die(){//触碰边缘死亡
         $(document).off('keydown');
         alert("死亡!!!");
        }
        
        function eat(sleft,stop){//计算两个盒子相撞证明snake eat到了food
         $("<div class='snake'></div>").appendTo($(".div1")).offset({top:stop,left:sleft}).fadeOut(extent,function(){$(this).remove()});
         let eatX = sleft - $("#food").offset().left;
         let eatY = stop - $("#food").offset().top;
         
         if(eatX<10 && eatX>-10 && eatY<10 && eatY>-15){
          food();//eat到food时调用food产生的方法
          sm-=50;//每eat到一个food将时速减少100sm
          extent+=50;
          $('span').text("得分:"+count++);
         }
        }
        
        
        $(document).keydown(function(event){//蛇的动作
         var keyNum = event.which;  //获取键值
         if(keyNum==37){//左
          $("#snake").stop();//用于切换方向时暂停之前的动作
          $("#snake").animate(
          {left:10},
          {
           duration: sm,
           step: function() {
            if($(this).offset().left<11){
             die();
            }
            eat($(this).offset().left,$(this).offset().top);
           }
          });
         }else if(keyNum==38){//上
          $("#snake").stop();
          $("#snake").animate(
          {top:27},
          {
           duration: sm,
           step: function() {
            if($(this).offset().top<28){
             die();
            }
            eat($(this).offset().left,$(this).offset().top);
           }
          });
         }else if(keyNum==39){//右
          $("#snake").stop();
          $("#snake").animate(
          {left:896},
          {
           duration: sm,
           step: function() {
            if($(this).offset().left>895){
             die();
            }
            eat($(this).offset().left,$(this).offset().top);
           }
          });
         }else if(keyNum==40){//下
          $("#snake").stop(); 
          $("#snake").animate(
          {top:615},
          {
           duration: sm,
           step: function() {
            if($(this).offset().top>614){
             die();
            }
            eat($(this).offset().left,$(this).offset().top);
           }
          });
         } 
        });
       
       });
      </script>
     </head>
     <body>
      <span>得分:</span>
      <div class="div1">
       <div id="snake" class="snake"><div>
       <div id="food" class="food"><div>
      </div>
    </body>
    </html>
    
    展开全文
  • html贪吃蛇源码

    2017-10-05 11:57:12
    html,js缩所写的贪吃蛇,源码简介清晰你可以,根据所写的注释读
  • H5网页版贪吃蛇源代码

    万次阅读 2017-06-15 16:25:27
    H5网页版贪吃蛇源代码,新建文本文档,将下面的代码复制粘贴到文本文档,然后保存文件。重命名文件及后缀名为index.html。将文章最下面的两个图片保存下来,蓝色背景大图重命名为back.jpg,骷髅头的命名为pirate.png...
  • html5贪吃蛇源码

    热门讨论 2016-03-13 12:07:45
    html5贪吃蛇源码,代码浅显易懂。
  • 本人原创的贪吃蛇源码,代码写的不是很好,用了链表操作,使用了HTML控件,大家可以用来学习学习,还是有学习价值的,谢谢啦。
  • 只用html和css和JavaScript写,没用其它任何语言,适用于刚接触前端,刚学完html,css,JavaScript的人练手用
  • 内含搬箱子,俄罗斯方块,拼图,最短距离小游戏,最简单的贪吃蛇。五个游戏的源代码,适合HTML学习者参考.
  • 维京战争,一个都不能死,捕鱼达人,植物大战僵尸,3D魔方,青蛙吃苍蝇,蜘蛛纸牌,贪吃蛇,水果削除,2048中文版,大鱼吃小鱼,飞机大战,跑酷小游戏,贪吃蛇2.0,射击鸭子,激流勇进,天天消消乐,别踩白块,线条...
  • TUROBOC可直接运行 适合C的入门初学者
  • 以前用pyhton 做了贪吃蛇游戏, 这里发表的是html/javascript 版本。难度差不多, 区别是python 主要用class, 而javascript 主要用function , 他们的功能很相似, 写法稍微有些不同。内容大致是: 1. 蛇由蛇头...
  • HTML5贪吃蛇源代码

    2017-06-25 21:31:00
    代码下载:点击这里! <script> function show(){ var date = new Date(); //日期对象 var now = ""; now = date.getFullYear()+"年"; //读英文即可了 now = now + (date.getMonth...
  • 科技常识:HTML5 贪吃蛇游戏实现思路及源代码2021-05-12 07:05:31•互联网今天小编跟大家讲解下有关HTML5 贪吃蛇游戏实现思路及源代码 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关HTML5 贪吃蛇游戏...
  • 评价(2) 举报(0) 添加专题已被下载116次简介: javase课程设计,贪吃蛇源代码,有实验报告.上学期自己写的课设感觉还不错,拿出来分享一下.游戏通过设置固定障碍物和随机障碍物来控制中级和高级,无障碍物为低级,另外可选...
  • javascript贪吃蛇完整版 注释完整,面向对象复制代码 代码如下:贪吃蛇 Snake v2.4body{font-size:9pt;}table{border-collapse: collapse;border:solid #333 1px;}td{height: 10px;width: 10px;font-size: 0px;}....
  • DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, ...
  • 贪吃蛇源代码分析

    千次阅读 多人点赞 2014-01-26 13:03:24
    今天已经是农历12月16号了,用这一篇博文给今年的博客画上一个句号吧。...首先,下载一个贪吃蛇源代码,结构如下:(网上资源很大,我这里就不给出了) 打开AndroidManifest.xml找到应用入口 package="com.xmob
  • JS学习——贪吃蛇代码(简易版)

    千次阅读 2021-05-17 18:14:00
    贪吃蛇目录页面游戏页面开始页面暂停页面代码html代码css代码js代码素材目录结构图片素材说明方块的构造函数方块原型上的方法蛇的构造函数蛇的初始化方法蛇的下一个位置方法(重点)这个方法用于获取蛇头的下一个...
  • 大二实习期间用js写的一个贪吃蛇游戏,对有些js和css/html的学习者有很大帮助。
  • 贪吃蛇源代码

    2021-06-19 22:23:49
    DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,551
精华内容 620
关键字:

html贪吃蛇源代码

友情链接: bpandpowerspectrum.rar