时间:2021-05-28
本文实例为大家分享了JavaScript实现扫雷小游戏的具体代码,供大家参考,具体内容如下
工具:Sublime Text / Dreamweaver /Hbuilder
<!doctype html><html><head><meta charset="utf-8"><title>SaoLei</title><style type="text/css">table{-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }</style></head><body><center style="margin:150px auto;"><h2 style="font-family:Comic Sans Ms;">Mine Clearance(扫雷)♦</h2><p>请设置行和列开始游戏</p><p>游戏难度:<select id="level" onchange="changelevel()"><option>小白级</option><option>大神级</option></select></p><p id="select_level"></p>行: <input type="text" id="rows"> 列: <input type="text" id="cols"> <button id="add" onClick="add()">PlayGame</button><br><p id="tips"></p><p id="leiNum"></p><table border="2" id="tab" ></table><p id="GScore"></p></center><script type="text/javascript"> var lei =new Array("♥","0","♥","♥","♥","♥"); var tab =$("tab"); var GScore=$("GScore"); var score=0; var tip=$("tips"); var time; var i=3; var row =$("rows"); var col =$("cols"); var Total=0; var lei_count =0; var levels= $("level"); var select_level=$("select_level"); function add() { clear(); tip.innerHTML="游戏开始"; score=0; GScore.innerHTML="当前得分:"+score; lei_count=0; tab.innerHTML=""; Total=0; Total=parseInt(row.value)*parseInt(col.value); for(var i=0;i<row.value;i++) { var newTr =document.createElement("tr"); newTr.id=i;// newTr.style.background="black"; for(var j=0;j<col.value;j++) {// var rand=parseInt(Math.random()*lei.length); newTr.innerHTML+="<td ><button id='"+i+","+j+"' style ='width:25px;height:25px;background:green; color:green; border:1px blue solid' οnclick='myclick(this)' οnmοuseοver='changecolor(this)' οnmοuseοut='resetcolor(this)'>"+lei[rand]+"</button></td>"; if(lei[rand]=="0") { lei_count++; } } tab.appendChild(newTr); } Total=Total-lei_count; var leinum =$("leiNum"); leinum.innerHTML="本局雷数:"+lei_count; } function $(id) { return document.getElementById(id); } function change(obj) { if(obj.innerHTML=="0") { time=setInterval(times,1000); obj.style.backgroundColor="red"; obj.innerHTML="💀"; alert("Game Over!"); }else { obj.style.backgroundColor="white"; score=score+1; } GScore.innerHTML="当前得分:"+score; } function myclick(obj) { if(obj.style.background!="white") { change(obj); check(obj); Total--; if(Total==0) { alert("你赢了!总分:"+score); } } } function changecolor(obj) { obj.style.border="1px red solid "; } function resetcolor(obj) { obj.style.border="1px blue solid"; } function times() { tip.innerHTML="游戏结束,"+i+"秒后重新开始游戏"; if(i==0) { add(); } i--; } function clear() { clearInterval(time); i=3; } function check(obj) { var index=0; var len =obj.id.split(","); index=Number(len[1]);//下标 var boom =0; //左节点 if(index-1>=0) { if(obj.parentNode.previousSibling.childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.previousSibling.childNodes[0].style.background="black"; } } //右节点 if(index!=Number(col.value)-1){ if(obj.parentNode.nextSibling.childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.nextSibling.childNodes[0].style.background="black"; } } //上节点 if(obj.parentNode.parentNode.id!="0"){ if(obj.parentNode.parentNode.previousSibling.childNodes[index].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.previousSibling.childNodes[index].childNodes[0].style.background="black"; } } //下节点 if(obj.parentNode.parentNode.id!=Number(row.value)-1){ if(obj.parentNode.parentNode.nextSibling.childNodes[index].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.nextSibling.childNodes[index].childNodes[0].style.background="black"; } } //左上节点 if(index-1>=0 && obj.parentNode.parentNode.id!="0"){ if(obj.parentNode.parentNode.previousSibling.childNodes[index-1].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.previousSibling.childNodes[index-1].childNodes[0].style.background="black"; } } //右上节点 if(index!=Number(col.value)-1 && obj.parentNode.parentNode.id!="0"){ if(obj.parentNode.parentNode.previousSibling.childNodes[index+1].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.previousSibling.childNodes[index+1].childNodes[0].style.background="black"; } } //左下节点 if(index-1>=0 && obj.parentNode.parentNode.id!=Number(row.value)-1){ if(obj.parentNode.parentNode.nextSibling.childNodes[index-1].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.nextSibling.childNodes[index-1].childNodes[0].style.background="black"; } } //右下节点 if(index!=Number(col.value)-1 && obj.parentNode.parentNode.id!=Number(row.value)-1){ if(obj.parentNode.parentNode.nextSibling.childNodes[index+1].childNodes[0].innerHTML=="0") { boom++; if(levels.value=="小白级") obj.parentNode.parentNode.nextSibling.childNodes[index+1].childNodes[0].style.background="black"; } } if(boom>0) obj.innerHTML=boom;elseobj.innerHTML=" "; } function changelevel() { var info=levels.value; if(levels.value=="小白级") { info+=" (自动排雷)"+"💀"; } else { info+="💀💀💀"; } select_level.innerHTML="你已选择:"+info; } window.onload=changelevel; </script> } </body></html>以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
初学javascript,写了一个扫雷程序练练手!扫雷规则及功能扫雷想必大家都不陌生,就是windows上点击排雷的小游戏,它的主要规则有1.左键点击显示当前格
C/C++实现扫雷小游戏源代码:github:https://github.com/KamSss/C-Practice/tree/master/Mineswee
本文实例为大家分享了C++实现扫雷、排雷小游戏的具体代码,供大家参考,具体内容如下界面:游戏思想:扫雷游戏:1.随机给定雷点坐标2.判断每个点的雷情况3.由用户
主要思想是借助Canvas自己的API-toDataURL()来实现,整个实现HTML+JavaScript的代码很简单。复制代码代码如下:window.onl
本文实例为大家分享了Javascript实现贪吃蛇小游戏的具体代码,供大家参考,具体内容如下前言原生JavaScript实现贪吃蛇小游戏GitHub地址直接复制