<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 建立索引的原则

    建索引的几大原则 1. 最左前缀匹配原则,非常重要的原则,mysql会一直向右匹配直到遇到范围查询(>.<.between.like)就停止匹配,比如a 1="" an ...

  2. struts项目中添加的jar包

    一般我们使用struts时,添加的jar如下: commons-fileupload-1.2.1.jar commons-io-1.3.2.jar freemarker-2.3.16.jar java ...

  3. mac + apache + php

    1: 设置下用sublimetext为默认打开方式, 确保下载sublimetext 2:设置下默认打开方式为sm sudo ln -s /Applications/Sublime\ Text\ 2. ...

  4. hdu 5755 Gambler Bo 高斯消元

    题目链接 给n*m的方格, 每个格子有值{0, 1, 2}. 然后可以对格子进行操作, 如果选择了一个格子, 那么这个格子的值+2, 这个格子上下左右的格子+1, 并且模3. 问你将所有格子变成0的操 ...

  5. Python学习笔记(三)Python的list和tuple

    list list类似其他语言中的数组,是一种有序的集合,可以随时添加和删除其中的元素. 使用len()函数可以获得list元素的个数. list的索引从0开始,当超出范围时会报IndexError错 ...

  6. MYSQL 二进制还原

    解决方法: mysqlbinlog bin_log_file_path_and_name | mysql -uroot -p 如: mysqlbinlog E:\DB\mysql_log\mysql_ ...

  7. bash快捷建-光标移到行首、行尾等

    转自:http://digdeeply.org/archives/12131599.html ctrl键组合ctrl+a:光标移到行首.ctrl+b:光标左移一个字母ctrl+c:杀死当前进程.ctr ...

  8. Hibernate的Criteria用法

    在hibernate的Session里面使用createCriteria可以创建一个Criteria实例帮助我们进行条件查询,不用自己串hql语句,很方便. 用法很简单,首先传Class实例创建Cri ...

  9. Aix_bugzilla

    原创作品,转载请注明出处! Bugzilla在AIX上部署,网上看到的不多.我耗费了很长时间才算部署完,记录在这里,以防忘记了. 一.    下载安装文件或源代码 1. 下载Bugzilla 3.6. ...

  10. Hibernate 、多表关联映射-多对一关系(many-to-one)

    Hibernate.cfg.xml: <session-factory name="sessionFactory"> <property name="h ...