Funcție pentru crearea tabelelor HTML în JavaScript

Să facem acum funcția createTable, care va crea un tabel de dimensiunea specificată și îl va adăuga la sfârșitul elementului dat.

Fie ca primul parametru al funcției noastre să primească numărul de rânduri, al doilea parametru - numărul de coloane, iar al treilea - o referință la elementul DOM, în interiorul căruia va fi creat tabelul nostru.

Să vedem cum vom utiliza funcția descrisă, atunci când va fi creată. Să presupunem, de exemplu, că avem dat următorul div:

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

Să facem în interiorul acestui div un tabel 3 pe 4:

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

Să presupunem acum că avem date două div-uri:

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

Să facem câte un tabel în fiecare dintre aceste div-uri:

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

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

Pentru ca tabelele create să fie imediat vizibile, puteți adăuga ceva CSS, de exemplu, acesta:

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

Iată șablonul funcției descrise:

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// aici vom crea tabelul cu rows rânduri și cols coloane
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

Completați codul șablonului funcției prezentat mai sus. Testați funcționarea funcției gata făcute.