之前看了别人用js做的一个扫雷游戏,但是发现有一堆bug,还不能配置!!
想了一下,自己也做了一个原生js的扫雷游戏,目前还没发现bug,欢迎指出!
游戏主体稍微复杂点的就是递归做扩散(也还好)!
设置了可配置的棋牌和雷数量,并对对输入进行验证!
HTML 没啥好看的!
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 <link rel="stylesheet" href="demo.css"> 9 <script src="demo.js"></script> 10 </head> 11 <body> 12 <div class="control"> 13 <div class="configure"> 14 <div class="col"> 15 <span>行数:</span><input type="text" id="col" placeholder="默认为10" value=""> 16 </div> 17 <div class="row"> 18 <span>列数:</span><input type="text" id="row" placeholder="默认为10" value=""> 19 </div> 20 <div class="lei"> 21 <span>地雷:</span><input type="text" id="lei" placeholder="默认为10" value=""> 22 </div> 23 </div> 24 <div class="dis"> 25 <button id="begin">开始游戏</button> 26 <button id="again">重新开始</button> 27 <span class="save">安全区</span> 28 <span class="lei">地雷</span> 29 <span class="flag">地雷标记</span> 30 </div> 31 <div class="sore"> 32 <div class="time">TIME:<span id="time"></span></div> 33 <div class="residual">剩余地雷:<span id="leave"></span></div> 34 </div> 35 </div> 36 <div id="mysaolei"></div> 37 </body> 38 </html>