Funktion för att skapa HTML-tabeller i JavaScript

Låt oss nu skapa funktionen createTable, som kommer att skapa en tabell med given storlek och lägga till den i slutet av ett givet element.

Låt vår funktion ta första parametern som antal rader, den andra parametern som antal kolumner, och den tredje som en referens till DOM-elementet inuti vår tabell kommer att skapas.

Låt oss se hur vi kommer att använda den beskrivna funktionen när den är skapad. Låt oss säga att vi till exempel har den här div:en:

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

Låt oss skapa en tabell inuti denna div 3 gånger 4:

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

Låt oss nu säga att vi har två div:ar:

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

Låt oss skapa vår egen tabell i var och en av dessa div:ar:

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

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

För att de skapade tabellerna omedelbart skall vara synliga, kan du lägga till lite CSS, till exempel sådan här:

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

Här är förgrunden till den beskrivna funktionen:

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// här skapar vi en tabell med rows rader och cols kolumner
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

Komplettera koden för ovanstående förgrund funktion. Testa funktionen när den är klar.