javascript实现简单打字游戏的方法

　　介绍

这篇文章主要介绍了javascript实现简单打字游戏的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获、下面让小编带着大家一起了解一下。

具体内容如下

& lt; html> 　　& lt; head> 　　& lt; meta  http-equiv=癈ontent-Type",内容=皌ext/html;, charset=UTF-8"比; 　　& lt; title>传智打字游戏& lt;/title> 　　& lt; style 类型=拔谋?css"比; 　　,.label { 　　位置:绝对的,左:大敌;0 px; 　　,} 　　& lt;/style> 　　& lt; script 类型=拔谋?javascript" https://www.yisu.com/zixun/, src=" game.js "> 　　
　　<输入id=" startBtn " type="按钮" value="开始游戏”οnclick=" startGame(这)"/> 　　 　　身体 　　 
 var  CODE =,“QWERTYUIOPASDFGHJKLZXCVBNM";
　　var  codeArray =, [];
　　var  number =0;祝福;
　　,//创建随机字母,
　　function  createCode () {//0-25
　　,var  index =,方法(math . random () * 26);
　　,return  CODE.charAt(指数);
　　}；
　　,//创建显示标签方法
　　function  createLabel(代码){/* *
　　,* & lt; label 类=發abel"比;
　　,一个
　　,& lt;/label>
　　,*/,var  label =, document.createElement (“label");=,label.className “label";=,label.style.top “50 px";=,label.innerHTML 代码;=,label.code 代码;
　　,
　　,var  html =, document.documentElement;
　　,
　　,//所有标签标签的x坐标
　　,var  labelX =,方法(math . random () * html.clientWidth);
　　,如果(labelX> 100) {
　　,labelX -=20;
　　,}
　　,=,,label.style.left  labelX +“px";
　　,
　　,return 标签;
　　}
　　,
　　时间=window.onload 函数(){
　　,. getelementbyid (“startBtn") .disabled =,假;
　　,
　　,
　　,//注册键盘事件
　　,document.documentElement.οnkeydοwn=函数(事件){
　　,var  keyCode =, event.keyCode;,//获取按下的吗
　　,var  code =, String.fromCharCode(键码);//a - z
　　,for  (, var 小姐:=,0;,小姐:& lt;, codeArray.length;,我+ +),{
　　,//标签标签
　　,var  label =, codeArray[我];
　　,如果(label.code==代码){
　　clearInterval才能(label.interval_id);
　　label.parentNode.removeChild才能(标签);
　　codeArray.splice才能(我,1);
　　数量才能+=10;
　　,,
　　,,. getelementbyid (“msg") .innerHTML =, +号,分“;
　　,打破;
　　,}
　　,}
　　,};
　　}；
　　,//让标签标签慢慢的从上向下移动
　　function  runLabelTop(标签){
　　,
　　,//获取页面的高度
　　,var  height =, Math.max (document.documentElement.clientHeight document.documentElement.scrollHeight);
　　,=,,label.interval_id  setInterval(函数(){//50 px
　　,var  top =,方法(label.style.top);
　　,最高+=1;
　　,//判断标签是否已经超过页面的高度
　　,如果(top>高30){
　　,removeLabel(标签,假);
　　,其他}{=,label.style.top 最高+“px";
　　,}
　　,},10);
　　}
　　,//flag =,假的用户没有按下该字母
　　function  removeLabel(标签、标志){
　　,clearInterval (label.interval_id);
　　,label.parentNode.removeChild(标签);
　　,codeArray.shift ();
　　,数量-=20;
　　,. getelementbyid (“msg") .innerHTML =, +号“分”;
　　}
　　,
　　var  game_id =,空;
　　,//开始游戏
　　function  startGame (startButton) {
　　,=,startButton.disabled 真实;
　　,=,,game_id  setInterval(函数(){
　　,//创建要显示的字符
　　,var  code =createCode ();
　　,//创建一个标签显示字符
　　,var  label =, createLabel(代码);
　　,
　　,//让标签标签慢慢向下移动,修改标签的style.top属性
　　,runLabelTop(标签);
　　,
　　,//把标签标签节加入到页面中
　　,document.body.appendChild(标签);
　　,codeArray.push(标签);
　　},1000);
　　}
　　,//停止游戏
　　function  stopGame () {
　　,clearInterval (game_id);
　　,for  (, var 小姐:=,0;,小姐:& lt;, codeArray.length;,我+ +),{
　　,clearInterval (codeArray[我].interval_id);
　　[我],codeArray .parentNode.removeChild (codeArray[我]);
　　,}=,codeArray  [];
　　,. getelementbyid (“startBtn") .disabled =,假;
　　}

感谢你能够认真阅读完这篇文章,希望小编分享的“javascript实现简单打字游戏的方法”这篇文章对大家有帮助,同时也希望大家多多支持,关注行业资讯频道,更多相关知识等着你来学习!

javascript实现简单打字游戏的方法