Funksioni për krijimin e tabelave HTML në JavaScript

Tani le të bëjmë funksionin createTable, i cili do të krijojë një tabelë me madhësinë e specifikuar dhe do ta shtojë atë në fund të elementit të dhënë.

Le të marrë funksioni ynë si parametër të parë numrin e rreshtave, si parametër të dytë - numrin e kolonave, dhe si parametër të tretë - një referencë për elementin DOM, brenda të cilit do të krijohet tabela jonë.

Le të shohim se si do të përdorim funksionin e përshkruar, kur të jetë krijuar. Le të themi, për shembull, se na është dhënë një div si ky:

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

Le të krijojmë brenda këtij div një tabelë 3 me 4:

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

Le të themi tani se na janë dhënë dy div:

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

Le të krijojmë tabelën tonë në secilin prej këtyre div:

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

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

Që tabelat e krijuara të jenë menjëherë të dukshme, mund të shtohet disa CSS, për shembull, si ky:

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

Këtu është stafi i funksionit të përshkruar:

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// këtu krijojmë tabelën me rows rreshta dhe cols kolona
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

Plotësoni kodin e stafit të funksionit të paraqitur më sipër. Testoni funksionimin e funksionit të përfunduar.