Hello! There is a two-dimensional matrix. I need to parse it into the table, but so that each table cell appears at 5 second intervals.

Here's what is at the moment:

document.write('<table>'); for(c = 0; c<dimension; c++){ document.write('<tr>'); for(r = 0; r<dimension; r++){ document.write('<td>'+ matrix[c][r] + '</td>'); } document.write('</tr>'); } document.write('</table>');

here I bring each element of the matrix into a separate cell. It turns out such a sign: label image

Can you please tell me how to make each cell of the label appear with a delay?

  • one
    Was it inserted into the document with a delay or did it appear? - MedvedevDev
  • @MedvedevDev was inserted into the document with a delay - kittycat_13

1 answer 1

  • Add a table in which all cells will be empty
  • Writing a function that will fill the next cell.
  • Make this function be called every x seconds (using setInterval ).
  • When the table is full, you need to call the clearInterval method.
  • You can change the contents of a table cell like this: table.rows[индекс_строки].cells[индекс_столбца].innerHTML = новое_значение

 let size = 5; let matrix = []; for (let i = 0; i < size; ++i) { matrix[i] = []; for (let j = 0; j < size; ++j) { matrix[i][j] = i + j; } } document.write('<table>'); for (c = 0; c < size; c++) { document.write('<tr>'); for (r = 0; r < size; r++) { document.write('<td></td>'); } document.write('</tr>'); } document.write('</table>'); let table = document.querySelector('table'); let i = 0; let j = 0; function addNewCell() { table.rows[i].cells[j].innerHTML = matrix[i][j]; ++j; if (j === size) { j = 0; ++i; } if (i === size) { clearInterval(intervalId); } } let intervalId = setInterval(addNewCell, 100);

  • one
    Hello! Thank you for your help) But I have a slightly different situation. Remember, yesterday we did fill the matrix in a spiral? So I need them to appear exactly in a spiral in the document. So I do not understand how to do this ( - kittycat_13
  • Where did all these tasks about the matrix come from?) How to make a spiral now I will write - diraria
  • Olympiad tasks for JS) The teacher gave me in the university. We must understand) - kittycat_13
  • Clear. I propose to create in advance an array of indices, in the order in which the corresponding cells are to be filled. The index can be represented as an array of length two. Initially, the array is empty, at each iteration of the loop that filled the matrix in a spiral, we will add a new element to this array. Further, instead of the variables i and j, which in my code were responsible for the current cell, we get one variable, the index in the array of indices. Each time we call the addNewCell method, we will increment this variable when it reaches size * size. Call clearInterval. - diraria September
  • one
    @diraria, oh well, how do I find out xDD - MedvedevDev