I do not know how to create cells for the sapper in html / css / javascript. With divs or something? I do not have enough knowledge for this.

  • Create a table of n rows and m columns. - Igor
  • a specific implementation would be good. For the sapper you need to number them somehow, then to operate them - Fischer Benkovscki

3 answers 3

Why should they be numbered? They have coordinates: vertical and horizontal indices.

 $("#field").append("<tr/><tr/><tr/><tr/><tr/>") .find("tr").append("<td/><td/><td/><td/><td/>"); 
 td { width:20px; height:20px; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border=1 id="field"></table>

  • Thank you very much! - Fischer Benkovscki
  • @FischerBenkovscki On health. Successes! - Igor
  • Thank you too! - Fischer Benkovscki

Here you have almost half the game "Minesweeper" on pure JS without using any libraries:

 //Заполнение минами. Такое заполнение для игры не подойдёт, его надо усовершенствовать: var mineField = []; for(var i = 0; i < 5; i++) mineField[i] = Math.round(Math.random() * 50 + 30).toString(2).slice(0,5).split(''); /* ДЛЯ ПРИМЕРА mineField будет примерно таким: 1 - мина, 0 - пустая клетка var mineField = [ ['0', '0', '0', '1', '0'], ['0', '1', '0', '0', '0'], ['0', '0', '1', '0', '1'], ['1', '0', '0', '1', '0'], ['0', '0', '1', '0', '0'] ]; */ for(var y = 0; y < 5; y++) { var tr = document.createElement('tr'); document.getElementById('mine-field').appendChild(tr); for(var x = 0; x < 5; x++) { var td = document.createElement('td'); td.align = 'center'; td.valign = 'middle'; td.x = x; td.y = y; td.innerHTML = '<a>&#x2715;</a>'; td.onclick = function() { //плюс стоит для преобразования в integer: if(+mineField[this.y][this.x]) { this.innerHTML = '<a>&#x1f4a3;</a>'; // Ваш код: если нажато на мину } else { this.innerHTML = '<a></a>'; //Ваш код: если нажато на пустую клетку и клетку возле мины } }; tr.appendChild(td); } } 
 #mine-field td{width: 24px; height: 24px; cursor: pointer} #mine-field td a{color: blue} 
 <table border="1" id="mine-field"></table>

    You can try through the tag TABLE, and there you can through the tag A in each cell. If you mean to enter the number of cells yourself, then this can be done through php

    • Thank you, but I don't know php - Fischer Benkovscki