微信小程序开源代码_javascript完成简略打字游戏

javascript实现简单打字游戏       这篇文章主要为大家详细介绍了javascript实现简单打字游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
meta http-equiv="Content-Type" content="text/html; charset=UTF-8" title 传智打字游戏 /title style type="text/css" .label{ position:absolute;left: 0px; /style script type="text/javascript" src="game.js" /script /head body div id="msg" /div input id="startBtn" type="button" value="开始游戏" οnclick="startGame(this)"/ input type="button" value="停止游戏" οnclick="stopGame()"/ /body /html
document.documentElement.οnkeydοwn=function(event){ var keyCode = event.keyCode; //获取按下的吗 var code = String.fromCharCode(keyCode);//A-Z for ( var i = 0; i codeArray.length; i++) { //label标签 var label = codeArray[i]; if(label.code==code){ clearInterval(label.interval_id); label.parentNode.removeChild(label); codeArray.splice(i,1); number+=10; document.getElementById("msg").innerHTML = number+"分"; break; //让label标签慢慢的从上向下移动 function runLabelTop(label){ //获取页面的高度 var height = Math.max(document.documentElement.clientHeight,document.documentElement.scrollHeight); label.interval_id = setInterval(function(){ //50px var top = parseInt(label.style.top); top+=1; //判断label是否已经超过页面的高度 if(top height-30){ removeLabel(label,false); }else{ label.style.top = top+"px"; },10); //flag = false用户没有按下该字母 function removeLabel(label,flag){ clearInterval(label.interval_id); label.parentNode.removeChild(label); codeArray.shift(); number-=20; document.getElementById("msg").innerHTML = number+"分"; var game_id = null; //开始游戏 function startGame(startButton){ startButton.disabled = true; game_id = setInterval(function(){ //创建要显示的字符 var code =createCode(); //创建一个label显示字符 var label = createLabel(code); //让label标签慢慢向下移动,修改标签的style.top属性 runLabelTop(label); //把label标签节加入到页面中 document.body.appendChild(label); codeArray.push(label); },1000); //停止游戏 function stopGame(){ clearInterval(game_id); for ( var i = 0; i codeArray.length; i++) { clearInterval(codeArray[i].interval_id); codeArray[i].parentNode.removeChild(codeArray[i]); codeArray = []; document.getElementById("startBtn").disabled = false; }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。


相关阅读