Kalendar në JavaScript

Në këtë seksion do të implementojmë një kalendar. Për thjeshtësi, do ta bëjmë në mënyrë që kalendari të shfaqë muazin aktual. Por me qëllim që të mund të përmirësohet më vonë në mënyrë që të mund të ndryshohet muaji dhe viti. Ja shembulli i asaj që duhet të marrim:

Ja paraqitja HTML që mund të përdorni gjatë zgjidhjes së problemit:

<div id="parent">
	<div id="calendar">
		<table>
			<thead>
				<tr>
					<th>Hën</th>
					<th>Mar</th>
					<th>Mër</th>
					<th>Enj</th>
					<th>Pre</th>
					<th>Sht</th>
					<th>Die</th>
				</tr>
			</thead>
			<tbody class="body"></tbody>
		</table>
	</div>
</div>

#parent {
	text-align: center;
}
#calendar {
	display: inline-block;
}
#calendar td, #calendar th {
	padding: 5px 12px;
	border: 1px solid black;
	text-align: center;
}

Le të marrim menjëherë referencat për të gjitha etiketat e nevojshme në variabla, dhe gjithashtu të regjistrojmë muazin dhe vitin aktual:

let calendar = document.querySelector('#calendar');
let body = calendar.querySelector('.body');

let date  = new Date();
let year  = date.getFullYear();
let month = date.getMonth();

Kopjoni për vete pjesët e kodit që unë kam paraqitur.