Función para crear tablas HTML en JavaScript

Ahora hagamos una función createTable, que creará una tabla del tamaño especificado y la agregará al final del elemento dado.

Dejemos que el primer parámetro de nuestra función reciba el número de filas, el segundo parámetro - el número de columnas, y el tercero - una referencia al elemento DOM, dentro del cual se creará nuestra tabla.

Veamos cómo usaremos la función descrita cuando esté creada. Supongamos, por ejemplo, que tenemos un div como este:

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

Hagamos una tabla dentro de este div 3 por 4:

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

Supongamos ahora que tenemos dos divs:

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

Hagamos nuestra propia tabla en cada uno de estos divs:

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

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

Para que las tablas creadas sean inmediatamente visibles, se puede agregar algo de CSS, por ejemplo, este:

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

Aquí está la plantilla de la función descrita:

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// aquí crearemos una tabla con rows filas y cols columnas
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

Complete el código de la plantilla anterior de la función. Pruebe el funcionamiento de la función terminada.