HTML táblázatok létrehozására szolgáló függvény JavaScriptben

Most készítsük el a createTable függvényt, amely egy megadott méretű táblázatot hoz létre és egy megadott elem végéhez adja hozzá.

Legyen az első paramétere a függvényünknek a sorok száma, a második paraméter az oszlopok száma, a harmadik pedig egy hivatkozás arra a DOM elemre, amelynek belsejében a táblázatunk létrejön.

Nézzük meg, hogyan fogjuk használni a leírt függvényt, amikor elkészül. Legyen például adott egy ilyen div:

<div id="elem"></div>

Készítsünk ezen a div belsejében egy 3 x 4-es táblázatot:

let div = document.querySelector('#elem');
createTable(3, 4, div);

Legyen most adott két div:

<div id="elem1"></div>
<div id="elem2"></div>

Készítsünk saját táblázatot mindkét divben:

let div1 = document.querySelector('#elem1');
createTable(3, 4, div1);

let div2 = document.querySelector('#elem2');
createTable(5, 6, div2);

Ahhoz, hogy a létrehozott táblázatok azonnal láthatók legyenek, adhatunk hozzá valamilyen CSS-t, például ilyet:

td {
	width: 50px;
	height: 50px;
	border: 1px solid black;
}

Itt van a leírt függvény vázlata:

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// itt hozzuk létre a táblázatot rows sorral és cols oszloppal
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

Egészítse ki a fenti függvényvázlat kódját. Tesztelje a kész függvény működését.