Javascript 3STI
Suite de tp3 (structures conditionnelles)
Gestion de temps en Javascript : l’objet Date
[Link]éation :
Mode de création Exemple
créer un nouvel objet de date avec la date et l'heure actuelles d = new Date();
d = new Date(2020, 11, 24, 10, 33, 30, 0);
Créer un nouvel objet de date avec une date et une heure spécifiées :
Remarque:JavaScript compte les mois de 0 à
on donne l'année, le mois, le jour, l'heure, la minute, la seconde et la
11.
milliseconde (dans cet ordre)
Janvier est 0. Décembre est 11.
créer un nouvel objet de date à partir d'une chaîne de date d = new Date("October 13, 2014 [Link]");
b.Méthode :
Méthode Description Exemple
toString() Retourne une chaîne de d = new Date();
caractères représentant la date d [Link]([Link]());
toDateString() convertit une date dans un format plus lisible [Link]([Link]());
getFullYear() renvoie l'année d'une date sous forme de nombre à d = new Date();
quatre chiffres [Link]([Link]());
getMonth() renvoie le mois d'une date sous forme de nombre (0-11) d = new Date();
[Link]([Link]());
getDate() renvoie le jour d'une date sous forme de nombre (1- d = new Date();
31) [Link]([Link]());
setDate() Modifie le numéro du jour du mois. d = new Date();
[Link]([Link]());
[Link](5)
[Link]("<br/>"+[Link]());
setMonth() Modifie le numéro du mois [Link](3) //modifier le mois en avril
[Link]("<br/>"+[Link]());
setFullYear() Modifie la valeur de l'année. [Link](2020)
[Link]("<br/>"+[Link]());
Activité 4 :
Créer une page web et un programme javascript qui étant donnée une date de naissance il calcule et affiche l’Age et
la saison correspondante.
Exemple :
En entrant la date
de naissance et
en sortant de
cette zone la page
affiche :
Correction de l’activité 4 :
[Link] [Link]
<body> function CalculAge() {
<label>Date de Naissance:</label> d=new Date([Link]("dn").value);
<input type="date" id="dn" // on lit la date de naissance
……………….="CalculAge()"> auj=………………………..; // La date d'ouverture de la page
<br><br> ann=[Link](); // l'année de la date de naissance
<label>Age : </label> anac=…………………….………; // l'année actuelle
<input type="text" name="age" id="Age"> [Link]("Age").value=………………………….
<br><br> mois=……………………………………….
<p> vous êtes nés en <span id="sais"> switch (…………….){
</span> </p> case 1: case 2: case 12:
<script …………………………> [Link]("sais")………………..="………….";
</script> </body> break;
9
Javascript 3STI
case ….: case …..: case …….:
[Link]("sais").innerHTML="printemps";
break;
case …..: case …….: case …..:
[Link]("sais").innerHTML="……….";
break;
case …….: case …….: case …….:
[Link]("sais").innerHTML="…………..";
break;
}
}
Activité 5:
Réaliser un script js qui permet d’afficher en temps réel la date dans une page web dés son chargement
sous la forme : « Nous sommes le jj-mm-aaaa» puis afficher si l’année est bissextile ou non. Une année
est dite bissextile si elle est divisible par 4 (elle possède 366 jours)
Correction de l’activité 5 :
[Link] [Link]
<body ………………………………..="afficherDateActuelle()"> function afficherDateActuelle()
<p> Nous sommes le <span id='z1'></span></p> { auj= ………………………………………..//créer un objet date
<div id="z2"></div> jour= …………………………………….//sauvegarder le jour
<script ……………………………………..> mois=………………………………………//sauvegarder le mois
</script> if (jour < 10){ jour=………………………}// jour sous forme jj
…..……………………………………………..//mois sous forme mm
Année=……………………………………// sauvegarder l’année
date =……………………………………………………. ;//jj-mm-aaaa
//afficher la date obtenue dans la zone 1
………………………………………………………………………………………………
//afficher dans la zone 2 si cette année est bissextile ou non
……………………………………………
……………………………………………………………………………….
………………………
……………………………………………………………………………….
}
Activité 6:
Réaliser un script js qui permet d’afficher en temps réel la date dans une page web sous la forme suivante :
Nous sommes le : J mois en toute lettre et l’année sur quatre chiffres
NB :Vous utiliserez les tableaux pour faire une transcription des mois (Janvier, Février, …).
Array (tableau) :
[Link]étés :
propriété Rôle exemple
t = new Array("sysème","technologie","internet");
n = [Link];
[Link](n); // il affiche ……..
length retourne la taille du tableau [Link]("<br>"+ t[0]) // il affiche ……..
new Array() ; permet de créer un nouveau tableau.
nomTableau[ i ] : permet d’accéder à la case i du tableau avec 0≤i < longueur du tableau
b.Méthodes :
Méthode Description Exemple
convertit un tableau en une chaîne de fruits = ["Banane", "Orange", "Pomme", "Mangue"];
toString() valeurs de tableau (séparées par des ch= [Link]();
virgules). alert(ch); // affiche ……………………..
Correction de l’activité 6 :
<script> //créer un tableau des mois
……………………………………………………………………………………………………………………
d=…………………..………..; //date actuelle
aujourdhui=……………………………………………………………………………………..//j mois aaaa
[Link]('Nous sommes le :'+aujourdhui);
</script>
10
