这几天一直在看网易云课堂上免费的JS课程，正好今天看到讲了计时器setInterval,第一感觉就是像C#里的TIMER。然后课程里举得例子正好通过计时器改变新生成窗口的位置，

然后就突然有了灵感！可以写一个“抓住我”的小游戏。

　　因为刚学JS 懂的实在很少，所以就通过自己已经学过的内容实现了，

主要原理是建一个5X5的表格，每一个格子里放一个DIV，并通过数字命名ID 1-25。

然后就是通过网上找的一个获取随机数的方式，getelementbyid获取随机的一个DIV并且通过innerHTML动态生成一个BUTTON。

在执行之前先删除之前生成的一个，然后通过计时器设置不同的间隔来执行。于是一个简单的CATCH ME小游戏完成了，然后又用了PHP随便写了一个记录分数的功能。

不多说了 大家自己看源代码吧

在线演示

PS:PHP也是这个星期刚接触。。所以只写了个最简单的通过GET传参数。。。于是可以随意刷分。。。莫吐槽。。。

初学JS——实现基于计时器的小游戏。的更多相关文章

  1. html+css+js实现狼吃羊小游戏

    html+css+js实现狼吃羊小游戏 一.总结 一句话总结:给动的元素下标记,这里表现为将要活动的标签动态增加class,这是一种很好的思想. 1.如何实现棋子走动的时候简单精确定位? 用重构坐标系 ...

  2. js实现简单的俄罗斯方块小游戏

    js实现简单的俄罗斯方块小游戏 开始 1. 创建一个宽为 200px,高为 360px 的背景容器 <!DOCTYPE html> <html lang="en" ...

  3. Three.js 实现3D开放世界小游戏：阿狸的多元宇宙 🦊

    声明:本文涉及图文和模型素材仅用于个人学习.研究和欣赏,请勿二次修改.非法传播.转载.出版.商用.及进行其他获利行为. 背景 2545光年之外的开普勒1028星系,有一颗色彩斑斓的宜居星球 ,星际移民 ...

  4. JS练习实例--编写经典小游戏俄罗斯方块

    最近在学习JavaScript,想编一些实例练练手,之前编了个贪吃蛇,但是实现时没有注意使用面向对象的思想,实现起来也比较简单所以就不总结了,今天就总结下俄罗斯方块小游戏的思路和实现吧(需要下载代码也 ...

  5. js、jQuery实现2048小游戏

    2048小游戏 一.游戏简介:  2048是一款休闲益智类的数字叠加小游戏 二. 游戏玩法: 在4*4的16宫格中,您可以选择上.下.左.右四个方向进行操作,数字会按方向移动,相邻的两个数字相同就会合 ...

  6. Three.js 实现3D全景侦探小游戏🕵️

    背景 你是嘿嘿嘿侦探社实习侦探️,接到上级指派任务,到甄开心小镇调查市民甄不戳宝石失窃案,根据线人流浪汉老石‍提供的线索,小偷就躲在小镇,快把他找出来,帮甄不戳寻回失窃的宝石吧! 本文使用 Three ...

  7. 用js写一个贪吃蛇小游戏

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 软件工程 Android小游戏 猜拳大战

    一.前言 最近学校举办的大学生程序设计竞赛,自己利用课余时间写了一个小游戏,最近一直在忙这个写这个小游戏,参加比赛,最终是老师说自己写的简单,可以做的更复杂的点的.加油 二.内容简介 自己玩过Andr ...

  9. 初学JS——利用JS制作的别踩白块儿（街机模式） 小游戏

    这个是上个星期5写的了,当时是突然想写个游戏,就想到了别踩白块儿,当时的想法是 可能普通模式的别踩白块儿因为他的“块儿”是滚动的向上这种,以我目前会的技术想不出怎么写, 但是如果是街机模式,通过你每按 ...

随机推荐

  1. VC++ MFC类库基础(55讲全)

    视频保存在播音员 网盘中内容简介: 本部分是您成为VC++软件工程师必备的阶段,如果您没有任何基础,学习C++能快速让您进入编程领域,建议配合书籍<C++入门经典> 关键词: VC++.V ...

  2. PHP使用MySQL报no such file or directory

    原因是没有连接数据库.加上下面代码: $link = mysql_connect(DB_HOST,DB_USER,DB_PWD);mysql_select_db(DB_NAME) or die('Co ...

  3. [转载]在VB.Net中获取COM对象的特定实例(Getting a specific instance of COM object in VB.Net)

    转载:http://www.it1352.com/534235.html 问题: I am writing a Windows Form application in .Net to list all ...

  4. 【js基础修炼之路】— 深入浅出理解闭包

    之前对于闭包的理解只是很肤浅的,只是浮于表面,这次深究了一下闭包,下面是我对闭包的理解. 什么是闭包? 引用高程里的话 => 闭包就是有权访问另一个作用域中变量的函数,闭包是由函数以及创建该函数 ...

  5. 如何查看某个用户指定时间段的ABAP开发记录

    输入用户名和想查询的时间段: 执行得到结果.双击可查看具体代码: 工具源代码: REPORT tool_dev_history. PARAMETERS: name TYPE usr02-bname O ...

  6. 入坑Ubuntu手记-系统安装和简单配置

    对于开发者而言,Linux的环境帮助是非常大的.同样的,Linux对很多Windows下的软件,尤其是游戏不支持,这也是一个非常重要的生产力的因素.嗯…我可能就是为了控制自己少玩游戏,直接上一个Ubu ...

  7. Google搜索引擎使用小技巧

    相信大家都知道,利用Google等搜索引擎进行信息查证是翻译过程中十分重要的一环.事实上,掌握信息搜索的技巧和方法,不仅对翻译工作大有帮助, 在网络信息时代,学会充分利用搜索引擎,在很多情况下都可以达 ...

  8. 2017.11.17 C++系列---用malloc动态给c++二维数组的申请与释放操作

    方法一:利用二级指针申请一个二维数组. #include<stdio.h> #include<stdlib.h> int main() { int **a; //用二级指针动态 ...

  9. python实现连续子数组的最大和

    题目描述 HZ偶尔会拿些专业问题来忽悠那些非计算机专业的同学.今天测试组开完会后,他又发话了:在古老的一维模式识别中,常常需要计算连续子向量的最大和,当向量全为正数的时候,问题很好解决.但是,如果向量 ...

  10. CXF报错[1 counts of IllegalAnnotationExceptions]and[Two classes have the same XML type name]and[Use @XmlType.name and @XmlType.namespace to assign different names to them]

    启动时CXF报错如下: Caused by: com.sun.xml.bind.v2.runtime.IllegalAnnotationsException: 1 counts of IllegalA ...