Remplissage séquentiel de tableaux HTML

Supposons que nous ayons un tableau HTML vide comme celui-ci :

<table id="table"></table>

Remplissons ce tableau avec des cellules et faisons en sorte que les nombres de 1 à 9 apparaissent dans ces cellules. Voici un exemple de ce que nous devrions obtenir :

<table id="table">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>

Passons à la mise en œuvre.

Pour commencer, créons simplement un tableau de taille 3 par 3, rempli de lettres 'x' :

let table = document.querySelector('#table');

for (let i = 0; i < 3; i++) {
	let tr = document.createElement('tr');
	
	for (let i = 0; i < 3; i++) {
		let td = document.createElement('td');
		td.textContent = 'x';
		tr.appendChild(td);
	}
	
	table.appendChild(tr);
}

Faisons maintenant en sorte qu'au lieu de lettres 'x', les nombres soient écrits dans les cellules par ordre croissant.

Pour ce faire, nous devons introduire un autre compteur qui augmentera séquentiellement ses valeurs à chaque itération de la boucle interne, comme ceci :

let table = document.querySelector('#table');

let k = 1; // valeur initiale du compteur
for (let i = 0; i < 3; i++) {
	let tr = document.createElement('tr');
	
	for (let i = 0; i < 3; i++) {
		let td = document.createElement('td');
		
		td.textContent = k; // écrivons le compteur dans la cellule
		k++; // incrémentons le compteur
		
		tr.appendChild(td);
	}
	
	table.appendChild(tr);
}

Affichez à l'écran un tableau HTML de taille 5 lignes sur 5 colonnes, de sorte que dans ses cellules se trouvent séquentiellement les nombres de 1 à 25.

Modifiez la tâche précédente pour que les nombres pairs soient écrits dans les cellules du tableau dans l'intervalle de 2 à 50.