<html>
 <head>
  <title>0.0</title>
  <script>
   window.onload=function Test(){
    alert("游戏提示，本游戏没有关卡限制，每次得分超过整百时,进入下一关，点击确定开始游戏吧！");
    var game=new Game();
    game.start();
   }
   var times;
   var words;
   var down=2;
   var fen=100;
   var createCharDiv=new Array();
   function Game(){
    //alert("coming game()");
    words=new Array("A","B","C","D","E","F","G","H","I","J","K","L","N","M","O","P","Q","R","S","T","U","V","W","Z","X","Y");
    var createBackground=new CreateBackground();
    var createScore=new CreateScore();
    //var createCharDiv=new CreateCharDiv();
    this.start=function(){
     for(var i=0;i<5;i++){
      createCharDiv[i]=new CreateCharDiv();
     }
    
     times=setInterval(function(){
      for(var i=0;i<5;i++){
       createCharDiv[i].move();
      }                
     },50);
    
     document.onkeydown=keydown;
     function keydown(e){
      var real=String.fromCharCode(e.which);
      //alert(real);
      for(var i=0;i<5;i++){
       if(createCharDiv[i].divHTML()==real){
        //alert("zhong");
        createScore.addScore();
        createCharDiv[i].againTop();
       }
      }     
     }
    }
    
    
   }
   function CreateBackground(){
    //alert("coming CreateBackground()");
    var newBackground;
    function initBackground(){
     //alert("coming initBackground()");
     newBackground=document.createElement("div");
     //alert(newBackground);
     newBackground.style.width="500px";
     newBackground.style.height="600px";
     newBackground.style.border="3px solid black";
     newBackground.style.position="absolute";
     //newBackground.style.background="pink";
     document.body.appendChild(newBackground);
    }
    initBackground();
   }
   function CreateScore(){
    //alert("1");
    var scoreboard;
    var score=0;
    function initScore(){
     //alert("2");
     scoreboard=document.createElement("div");
     scoreboard.style.width="100px";
     scoreboard.style.height="20";
     scoreboard.style.top="10px";
     scoreboard.style.left="405px";
     scoreboard.style.position="absolute";
     scoreboard.style.border="3px solid black";
     scoreboard.style.background="green";
     scoreboard.innerHTML="得分："+score;
     document.body.appendChild(scoreboard);
     //alert(scoreboard);
    }
    initScore();
    
    this.addScore=function(){
     score+=10;
     scoreboard.innerHTML="";
     scoreboard.innerHTML="得分："+score;
     if(score==fen){
      alert("亲，即将进入下一关，请做好准备！");
      down++;
      fen+=100;
      //alert("fen"+fen);
      for(var i=0;i<5;i++){
       createCharDiv[i].againTop();
      }
     }
     
    }
   }
   
   
   function CreateCharDiv(){
    //alert("CreateCharDiv()");
    var newDiv;
    var numbs=0;
    function initCharDiv(){
     //alert("initCharDiv()");

num=parseInt(Math.random()*words.length);
     //alert(words.length);
     newDiv=document.createElement("div");
     newDiv.style.width="30px";
     newDiv.style.height="30px";
     newDiv.style.border="1px solid black";
     newDiv.style.position="absolute";
     newDiv.style.top="20px";
     //规定范围内取随机数   *（上限-下限+1）+下限
     //newDiv.style.left=parseInt(Math.random()*480)+"px";
     newDiv.style.left=parseInt(Math.random()*(470-20+1)+20)+"px";
     newDiv.style.background="red";
     newDiv.innerHTML=words[num];
     document.body.appendChild(newDiv);
    }
    initCharDiv();
    
    this.move=function(){
     //alert("move()");
     newDiv.style.top=parseInt(newDiv.style.top)+down;
     if(parseInt(newDiv.style.top)>580){
      clearInterval(times);
      alert("oh oh oh , game over !");
     }
    }
    this.divHTML=function(){
     return newDiv.innerHTML;
    }
    this.againTop=function(){
     newDiv.style.display="none";
      initCharDiv();          
    }
    
   }
   
  </script>
 </head>
 <body> 
 </body>
</html>

用OO方式写键盘字母小游戏的更多相关文章

  1. C语言写的2048小游戏

    基于"基于C_语言的2048算法设计_颜冠鹏.pdf" 这一篇文献提供的思路 在中国知网上能找到 就不贴具体内容了 [摘 要] 针对2048的游戏规则,分析了该游戏的算法特点,对其 ...

  2. 用面向对象的编程方式实现飞机大战小游戏，java版

    概述 本文将使用java语言以面向对象的编程方式一步一步实现飞机大战这个小游戏 本篇文章仅供参考,如有写的不好的地方或者各位读者哪里没看懂可以在评论区给我留言 或者邮件8274551712@qq.co ...

  3. 几款用jQuery写的h5小游戏

    人人都说前端用来做游戏是一件很困难的事情,遇到这些js的逻辑性问题,是不是有点懵?其实,做完一款游戏之后就会发现,没啥难的地方,差不多都是换汤不换药,作为爱玩游戏的我,也总结收集了几款比较流行的小软件 ...

  4. C/C++编程笔记：C语言写推箱子小游戏，大一学习C语言练手项目

    C语言,作为大多数人的第一门编程语言,重要性不言而喻,很多编程习惯,逻辑方式在此时就已经形成了.这个是我在大一学习 C语言 后写的推箱子小游戏,自己的逻辑能力得到了提升,在这里同大家分享这个推箱子小游 ...

  5. 用python+pygame写贪吃蛇小游戏

    因为python语法简单好上手,前两天在想能不能用python写个小游戏出来,就上网搜了一下发现了pygame这个写2D游戏的库.了解了两天再参考了一些资料就开始写贪吃蛇这个小游戏. 毕竟最开始的练手 ...

  6. 无聊的周末用Java写个扫雷小游戏

    周末无聊,用Java写了一个扫雷程序,说起来,这个应该是在学校的时候,写会比较好玩,毕竟自己实现一个小游戏,还是比较好玩的.说实话,扫雷程序里面核心的东西,只有点击的时候,去触发更新数据这一步. Sw ...

  7. 原生js写的flybird小游戏

    游戏地址:http://zangzhihong.jusukeji.com/flybird/index.html html部分 <!DOCTYPE html>   <!-- This ...

  8. 利用while循环写的简单小游戏猜数字

    猜数字的大小游戏 C:\Users\Administrator>python Python 3.6.8 (tags/v3.6.8:3c6b436a57, Dec 23 2018, 23:31:1 ...

  9. HttpWeb服务器之--用OO方式写

    虽然写的不是很好,但 最终解释权以及版权归13东倍所有! package com.web; import java.io.IOException; public class Test { public ...

随机推荐

  1. mysql优化(3) 集群配置

    两台服务器 192.168.187.131 192.168.187.132 1.主从配置 131为主 132为从 在131下 vim /etc/my.cnf [mysqld] datadir=/var ...

  2. 关于ASP .Net Core 引用dll 一

    一:ASP.Net Core 引用dll文件,不可以直接引用,必须在NuGet中引用才行. 二:如果想引用自己的dll文件,则需要注册NeGet账号,获取到API Key 才行,还需要下载NuGet安 ...

  3. IE9下Ajax缓存问题

    使用jQuery的getJSON从后台定时获取数据并刷新界面,使用以下方法时,在Chrome,Firefox下没问题,但在IE9下却无法刷新数据 $.getJSON(webApp + "/G ...

  4. editplus使用:非法字符： \65279

    众所周知,在跨程序的工程中,统一编码是至关重要的,而目前最普遍的则是统一采用“utf8”编码方案. 但是在采用utf8方案的时候,请注意编辑器的自作聪明. 比如editplus. 原因就在于某些编辑器 ...

  5. 为何与0xff进行与运算

    为何与0xff进行与运算 在剖析该问题前请看如下代码 public static String bytes2HexString(byte[] b) { String ret = "" ...

  6. Cannot access empty property

    致命错误:不能够进入此空值,位于E:\sunlion\web\down\class\db_sql.php 代码 <?php Class TestClass1{ var $class2; publ ...

  7. Maven 搭建与my-app项目测试

    前提条件,安装jdk1.6及以上版本,并配置JAVA_HOME 首先,下载Maven3.2.2,附下载地址:http://mirror.bit.edu.cn/apache/maven/maven-3/ ...

  8. Cannot create JDBC driver of class '' for connect URL 'jdbc:mysql://127.0.0.1:3306/test'

    原来的配置如下: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http ...

  9. Android开发问题汇总（持续更新）

    在Android开发中,总会有一些很小的问题.由于我们的不仔细,很容易忽略掉,从而导致在该问题上花费了很多的时间,造成工作进度的延迟. 为此,在这里做一下记录,避免再次浪费许多时间在这些问题上. 1. ...

  10. js基础——cssText

    以前,只知道设置css里的属性都是通过  元素.style.属性名 = 属性值  的方式,此时经常遇到的情况就是类似这样: var head= document.getElementById(&quo ...