HTML lentelių kūrimas JavaScript

Tarkime, kad turime tokią tuščią HTML lentelę:

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

Užpildykime šią lentelę eilutėmis ir stulpeliais. Štai pavyzdys, ką turėtume gauti:

<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>

Norint išspręsti užduotį, mums reikia dviejų įdėtų ciklų. Pirmasis ciklas kurs lentelės eilutes, o antrasis - langelius kiekvienoje eilutėje:

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);
}

Duota tuščia HTML lentelė. Naudodami du įdėtus ciklus for užpildykite šią lentelę 5 eilutėmis su 5 stulpeliais.

Modifikuokite ankstesnę užduotį taip, kad lentelė būtų sukurta 10 eilučių ir 5 stulpelių dydžio.

Modifikuokite ankstesnę užduotį taip, kad į kiekvieną td būtų pridėtas tekstas 'x'.

Įgyvendinkite lentelių generatorių, kuriame lentelės plotis ir aukštis nustatomas dviejuose įvesties laukuose (pavyzdžiui, lentelė 5 iš 10 langelių).