Calendrier en JavaScript

Dans cette section, nous allons implémenter un calendrier. Pour simplifier, nous allons simplement faire en sorte que le calendrier s'affiche pour le mois en cours. Mais avec l'idée qu'il pourra être amélioré pour pouvoir changer le mois et l'année. Voici un exemple de ce que nous devrions obtenir :

Voici le balisage que vous pouvez utiliser pour résoudre la tâche :

<div id="parent">
	<div id="calendar">
		<table>
			<thead>
				<tr>
					<th>lun</th>
					<th>mar</th>
					<th>mer</th>
					<th>jeu</th>
					<th>ven</th>
					<th>sam</th>
					<th>dim</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;
}

Immédiatement, récupérons les références vers toutes les balises nécessaires dans des variables, et enregistrons également le mois et l'année en cours :

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

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

Copiez les ébauches de code que je vous ai présentées.