js版扫雷实现代码原理不错

更新时间：2009年11月25日 21:33:28 作者：

前一段时间在图书馆看了本关于JavaScript的书，上面讲怎样用js编推箱子小游戏。我想，那扫雷也当然能编出来，然后就用DW试了试，结果如下。

效果图：

以下代码复制粘贴到记事本后保存为.html文件，打开后会出现提示，右击允许即可：

<!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>寻雷-----by 魅月</title> <style type="text/css">  </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>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

js
扫雷

JavaScript位移运算符(无符号) >>> 三个大于号的使用方法详解
这篇文章主要介绍了JavaScript位移运算符(无符号) >>> 三个大于号的使用方法详解的相关资料,需要的朋友可以参考下
2016-03-03
js实现索引图片切换效果
这篇文章主要介绍了js实现索引图片切换效果的代码，特别炫酷的效果，推荐给大家，感兴趣的小伙伴们可以参考一下
2015-11-11
微信小程序picker组件下拉框选择input输入框的实例
这篇文章主要介绍了微信小程序picker组件下拉框选择input输入框的实例的相关资料,希望通过本文能帮助到大家，需要的朋友可以参考下
2017-09-09
微信小程序8种数据通信的方式小结
这篇文章主要介绍了微信小程序8种数据通信的方式小结，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-02-02
JS+CSS实现TreeMenu二级树形菜单完整实例
这篇文章主要介绍了JS+CSS实现TreeMenu二级树形菜单,以完整实例形式较为详细的分析了JS二级树形菜单的节点元素操作技巧,非常简单实用,需要的朋友可以参考下
2015-09-09
详解element-ui 表单校验 Rules 配置常用黑科技
这篇文章主要介绍了element-ui 表单校验 Rules 配置常用黑科技，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2020-07-07
JS实现图片手风琴效果
这篇文章主要为大家详细介绍了JavaScript实现图片手风琴效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-08-08
js实现鼠标感应图片展示的方法
这篇文章主要介绍了js实现鼠标感应图片展示的方法,实例分析了javascript鼠标事件及样式的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-02-02
多附件上传组件演示
多附件上传组件演示...
2006-09-09
JS event使用方法详解
event代表事件的状态，例如触发event对象的元素、鼠标的位置及状态、按下的键等等。 event对象只在事件发生的过程中才有效。
2008-04-04