Penciptaan Jadual HTML dalam JavaScript

Katakan kita mempunyai jadual HTML kosong seperti ini:

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

Mari kita isi jadual ini dengan baris dan lajur. Berikut adalah contoh apa yang sepatutnya kita dapat:

<table id="table">
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
</table>

Untuk menyelesaikan masalah ini, kita memerlukan dua gelung bersarang. Gelung pertama akan mencipta baris jadual, dan yang kedua - sel dalam setiap baris:

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');
		tr.appendChild(td);
	}
	
	table.appendChild(tr);
}

Diberi jadual HTML kosong. Dengan menggunakan dua gelung bersarang for isikan jadual ini dengan 5 baris dan 5 lajur.

Ubah suai tugas sebelumnya supaya jadual dicipta dengan saiz 10 baris dengan 5 lajur.

Ubah suai tugas sebelumnya supaya ke dalam setiap td ditambah teks 'x'.

Laksanakan penjana jadual, lebar dan tinggi jadual ditetapkan dalam dua input (contohnya, jadual 5 dengan 10 sel).