JS扫雷原理性代码

Posted 易小川

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS扫雷原理性代码相关的知识,希望对你有一定的参考价值。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>寻雷</title> 
<style type="text/css"> 
<!-- 
td { 
font-size: 18px; 
font-weight: bold; 
color: #FF0000; 
text-align: center; 
height: 25px; 
width: 25px; 
border-top-width: 1px; 
border-right-width: 2px; 
border-bottom-width: 2px; 
border-left-width: 1px; 
border-top-style: solid; 
border-right-style: solid; 
border-bottom-style: solid; 
border-left-style: solid; 
border-top-color: #0000FF; 
border-right-color: #0000FF; 
border-bottom-color: #0000FF; 
border-left-color: #0000FF; 
} 
div { 
font-family: "宋体", "新宋体", "黑体"; 
font-size: 12px; 
font-weight: bold; 
color: #006600; 
float: none; 
margin-right: auto; 
margin-left: auto; 
height: 100px; 
width: 500px; 
text-align: center; 
} 
--> 
</style> 
<script language="javascript"> 
var data=new Array( 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0], 
[0,0,0,0,0,0,0,0,0,0,0] 
); 
var count=0; 
do{ 
var a=1+Math.round(8*(Math.random())); 
var b=1+Math.round(8*(Math.random())); 
if(data[a][b]==0){ 
data[a][b]="shit"; 
count+=1; 
} 
}while(count<10) 
for(var i=1;i<10;i++){ 
for(var j=1;j<10;j++){ 
if(data[i][j]!="shit"){ 
var counter=0; 
if(data[i-1][j-1]=="shit") counter+=1; 
if(data[i-1][j]=="shit") counter+=1; 
if(data[i-1][j+1]=="shit") counter+=1; 
if(data[i][j-1]=="shit") counter+=1; 
if(data[i][j+1]=="shit") counter+=1; 
if(data[i+1][j-1]=="shit") counter+=1; 
if(data[i+1][j]=="shit") counter+=1; 
if(data[i+1][j+1]=="shit") counter+=1; 
data[i][j]=counter; 
} 
} 
} 
function pop(){ 
event.bubbles=true; 
var number=parseInt(event.srcElement.getAttribute("id")); 
var j=number % 10; 
var i=(number-j)/10; 
if(data[i][j]=="shit"){ 
alert("中雷了"); 
check(); 
return; 
} 
if(data[i][j]==0){ 
for(var p=i-1;p<i+2;p++){ 
for(var q=j-1;q<j+2;q++){ 
var r="" +p+""+q; 
var oElement=document.getElementById(r); 
if(oElement){ 
oElement.innerHTML=data[p][q]; 
} 
} 
} 
return; 
} 
document.getElementById(event.srcElement.getAttribute("id")).innerHTML=data[i][j]; 
} 
function check(){ 
for(var i=1;i<10;i++){ 
for(var j=1;j<10;j++){ 
var no="" + i+""+j; 
document.getElementById(no).innerHTML=data[i][j]; 
} 
} 
} 
</script> 
</head> 

<body> 
<table id="lei" border="1" align="center" onclick="pop();" > 
<tr> 
<td id="11">&nbsp;</td> 
<td id="12">&nbsp;</td> 
<td id="13">&nbsp;</td> 
<td id="14">&nbsp;</td> 
<td id="15">&nbsp;</td> 
<td id="16">&nbsp;</td> 
<td id="17">&nbsp;</td> 
<td id="18">&nbsp;</td> 
<td id="19">&nbsp;</td> 
</tr> 
<tr> 
<td id="21">&nbsp;</td> 
<td id="22">&nbsp;</td> 
<td id="23">&nbsp;</td> 
<td id="24">&nbsp;</td> 
<td id="25">&nbsp;</td> 
<td id="26">&nbsp;</td> 
<td id="27">&nbsp;</td> 
<td id="28">&nbsp;</td> 
<td id="29">&nbsp;</td> 
</tr> 
<tr> 
<td id="31">&nbsp;</td> 
<td id="32">&nbsp;</td> 
<td id="33">&nbsp;</td> 
<td id="34">&nbsp;</td> 
<td id="35">&nbsp;</td> 
<td id="36">&nbsp;</td> 
<td id="37">&nbsp;</td> 
<td id="38">&nbsp;</td> 
<td id="39">&nbsp;</td> 
</tr> 
<tr> 
<td id="41">&nbsp;</td> 
<td id="42">&nbsp;</td> 
<td id="43">&nbsp;</td> 
<td id="44">&nbsp;</td> 
<td id="45">&nbsp;</td> 
<td id="46">&nbsp;</td> 
<td id="47">&nbsp;</td> 
<td id="48">&nbsp;</td> 
<td id="49">&nbsp;</td> 
</tr> 
<tr> 
<td id="51">&nbsp;</td> 
<td id="52">&nbsp;</td> 
<td id="53">&nbsp;</td> 
<td id="54">&nbsp;</td> 
<td id="55">&nbsp;</td> 
<td id="56">&nbsp;</td> 
<td id="57">&nbsp;</td> 
<td id="58">&nbsp;</td> 
<td id="59">&nbsp;</td> 
</tr> 
<tr> 
<td id="61">&nbsp;</td> 
<td id="62">&nbsp;</td> 
<td id="63">&nbsp;</td> 
<td id="64">&nbsp;</td> 
<td id="65">&nbsp;</td> 
<td id="66">&nbsp;</td> 
<td id="67">&nbsp;</td> 
<td id="68">&nbsp;</td> 
<td id="69">&nbsp;</td> 
</tr> 
<tr> 
<td id="71">&nbsp;</td> 
<td id="72">&nbsp;</td> 
<td id="73">&nbsp;</td> 
<td id="74">&nbsp;</td> 
<td id="75">&nbsp;</td> 
<td id="76">&nbsp;</td> 
<td id="77">&nbsp;</td> 
<td id="78">&nbsp;</td> 
<td id="79">&nbsp;</td> 
</tr> 
<tr> 
<td id="81">&nbsp;</td> 
<td id="82">&nbsp;</td> 
<td id="83">&nbsp;</td> 
<td id="84">&nbsp;</td> 
<td id="85">&nbsp;</td> 
<td id="86">&nbsp;</td> 
<td id="87">&nbsp;</td> 
<td id="88">&nbsp;</td> 
<td id="89">&nbsp;</td> 
</tr> 
<tr> 
<td id="91">&nbsp;</td> 
<td id="92">&nbsp;</td> 
<td id="93">&nbsp;</td> 
<td id="94">&nbsp;</td> 
<td id="95">&nbsp;</td> 
<td id="96">&nbsp;</td> 
<td id="97">&nbsp;</td> 
<td id="98">&nbsp;</td> 
<td id="99">&nbsp;</td> 
</tr> 
</table> 
</body> 
</html> 

 

以上是关于JS扫雷原理性代码的主要内容,如果未能解决你的问题,请参考以下文章

Js 网页版扫雷游戏代码实现

运用HTML+CSS+JavaScript实现扫雷游戏

运用HTML+CSS+JavaScript实现扫雷游戏

vue-苟曰的老板不发工资230行原创js代码写个扫雷小游戏

c语言初学者如何代码实现 扫雷 游戏

JS最佳实践