1° Définir la date du jours
Définir la date locale en créant l' objet Date. date1= new Date();
La date peut-être affichée:
en définissant const options={weekday:'long',year:'numeric',month:'long',day:'numeric'};
en appelant la propriétée toLocaleDateString();
ex:const date1=new Date(),options={weekday:'long',year:'numeric',month:'long',day:'numeric'};
let dat0=date1.toLocaleDateString(undefined,options);
affichage:
2° Définir le mois en cours.
Acquérir le mois en cours de l' objet Date(). ex: date1.getMonth();
getMonth(); affiche un résultat compris entre 0 et 11.
Acquérir l' année en cours avec la propriétée de l' objet Date, getFullYear(); getYear() étant obsoléte.
date1.getFullYear(); donne:
3° Nombre de jours dans le mois.
Définir le calendrier du mois en cours date1.getMonth() retourne:
Créer un tableau définissant le nombre de jours par mois, pensez à corriger pour les années bissextiles.
let nbJmois=[31,28,31,30,31,30,31,31,30,31,30,31];
Pour savoir si c' est une année bissextile:
Si le modulo (%) de l' année par 400 est égal à 0 oû l' année par 4 égal 0 et l' année par 100 est différent de zéro, c' est une année bissextile.
if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)){nbJmois[1] = 29;}
else{nbJmois[1]=28;}
4° premier jour du mois.
date.getDay(); retourne un indice du premier jour.
[Dim,Lun,Mar,Mer,Jeu,Ven,Sam]
pour la version Française, il faut corriger la position du Dimanche.
et convertir le 0 en 7 pour placer le 1 au bon endroit.
l' incrément commence à 1 et non pas 0.
5° affichage du calendrier.
Pour génerer le calendrier, j' ai utilisé des boucles, l' incrément (i) est supérieure au nombre de jours.
le premier jour du mois ne commençant pas un Lundi.
choisir la date:
l' acquisition de la date se fait par l' insertion d' une fonction à la création du calendrier.
<td onclick="dayTarget('+y1+','+m1+','+1+')>
les arguments correspondent à la date de chaque éléments.
il est possible d' utiliser une fonction event.target.textContent
<td onclick="dayTarget(event)">
la fonction: function dayTarget(event){let dt1=event.target.textContent;.....}