Modifie les informations de localisation
L’objet date est un objet permettant les manipulations des dates et des périodes
L'objet Date est un objet JavaScript intégré. Il vous permet d'obtenir l'heure locale de l'utilisateur en accédant à l'horloge du système informatique par le biais du navigateur. L'objet Date fournit également plusieurs méthodes pour gérer, manipuler et formater les dates et les heures.
L’objet date est un objet permettant les manipulations des dates et temps.
L'objet date est employé pour fonctionner avec des dates et des périodes.
Avant de pouvoir manipuler la date et l'heure, il faut créer un objet Date. Contrairement à d'autres objets intégrés, tels que les tableaux ou les fonctions, les dates n'ont pas de forme littérale correspondante : tous les objets Date doivent être créés à l'aide de la fonction constructeur Date, qui est Date().
Il existe quatre possibilités de créer un objet Date en JavaScript.
new Date() // date et temps courant
new Date(milliseconds) //millisecondes depuis 01/01/1970
new Date(dateString)
new Date(année, mois, jour, heurs, minutes, seconds, millisecondes)
La plupart des paramètres ci-dessus sont facultatifs. Si on ne spécifie pas un des paramètre il prend la valeur zéro .
Une fois qu'un objet date est créé, un certain nombre de méthodes permettent de le manipuler.
La plupart des méthodes permettent d'obtenir et placer l'année, le mois, le jour, l'heure, la minute, la seconde, et les millisecondes de l'objet, utilisant l'heure locale ou le temps UTC (universel, ou GMT).
Toutes les dates sont calculées en millisecondes à partir du 1er janvier 1970 à zéro heure : Temps 00 universel avec un jour contenant 86.400.000 millisecondes.
Quelques exemples d'instancier une date :
Vous pouvez simplement déclarer un nouvel objet Date sans initialiser sa valeur. Dans ce cas, la valeur de la date et de l'heure sera fixée à la date et à l'heure actuelles sur le périphérique de l'utilisateur sur lequel le script est exécuté.
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Création d'un objet date en JavaScript</title>
</head>
<body>
<script>
var d = new Date();
document.write(" Aujourduit est : "+d);
</script>
</body>
</html>
On peut initialiser un objet Date en passant les paramètres suivants séparés par des virgules : année, mois, jour, heures, minutes, secondes et millisecondes.
Les paramètres année et mois sont obligatoires ; les autres paramètres sont facultatifs.
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript : passer des paramètres à l'objet date</title>
</head>
<body>
<script>
var d = new Date(2010,0,31,14,35,20,50);
document.write("Le jour est : "+d);
</script>
</body>
</html>
Vous pouvez omettre la partie "heure" et ne spécifier que la partie "date" si vous le désirez.
JavaScript permet également de créer un objet Date en passant la chaîne représentant une date, ou une date et une heure, en paramètre comme dans l'exemple suivant
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript Construire un objet date en passant par une date sous forme de chaîne de caractères</title>
</head>
<body>
<script>
var d = new Date("28 January 2010");
document.write("Le jour est : "+d);
</script>
</body>
</html>
On peut aussi définir un objet Date en indiquant le nombre de millisecondes depuis le 1er janvier 1970, à 00:00:00 GMT. On appelle ce temps l'époque UNIX (ou le timestamp) car 1970 est l'année où le système d'exploitation UNIX a été officiellement introduit. Voici un exemple :
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript Définir un objet date en passant le nombre de millisecondes comme paramètre</title>
</head>
<body>
<script>
var d = new Date(1196110009801);
document.write("Le jour est : "+d);
</script>
</body>
</html>
Le code ci-dessus représente le lundi 26 Novembre 2007 à 20 :46 :49 GMT+0000
Une fois que vous avez créé une instance de l'objet Date, vous pouvez utiliser ses méthodes pour effectuer diverses tâches, telles que l'obtention de différentes composantes d'une date, la définition ou la modification d'une seule valeur de date et d'heure, etc. Ces méthodes sont décrites en détail dans les sections qui vont suivre.
Pour obtenir la date et l'heure actuelles, créez un nouvel objet Date sans passer de paramètres. Cela créera un objet contenant la date et l'heure actuelles. Voici un exemple :
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript - Obtenir la date et l'heure actuelles</title>
</head>
<body>
<script>
var maintenant = new Date();
document.write(maintenant); // Affiche la date et l'heure actuelles
</script>
</body>
</html>
L'objet JavaScript Date fournit plusieurs méthodes, telles que toDateString(), toLocaleDateString(), etc. pour générer des chaînes de date dans différents formats. Voici un exemple :
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript Générer une chaîne de caractères date</title>
</head>
<body>
<script>
var d = new Date();
document.write(d.toDateString() + "<br>"); // Affiche une date abrégée string
document.write(d.toLocaleDateString() + "<br>"); // Affiche une chaîne de date localisée
document.write(d.toISOString() + "<br>"); // affiche la chaîne de caractères de la date normalisée ISO
document.write(d.toUTCString() + "<br>"); /* affiche une chaîne de caractères de date convertie en temps UTC*/
document.write(d.toString()); /* Affiche la chaîne de caractères de la date complète avec le fuseau horaire local*/
</script>
</body>
</html>
De même, vous pouvez utiliser les méthodes toLocaleTimeString(), toTimeString() de l'objet Date pour générer des chaînes de temps, comme le montre l'exemple suivant :
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript Générer des chaînes de temps</title>
</head>
<body>
<script>
var d = new Date();
document.write(d.toTimeString() + "<br>"); // Afficher la partie horaire de la date
document.write(d.toLocaleTimeString()); // Afficher une chaîne de temps localisée
</script>
</body>
</html>
Une fois que vous disposez d'un objet Date approprié, un certain nombre de méthodes sont à votre disposition pour en extraire des détails, tels que le mois, la date, la valeur des heures ou des minutes, etc. Les paragraphes suivants décrivent les différentes méthodes permettant d'extraire des éléments d'information individuels d'un objet Date.
L'objet Date fournit plusieurs méthodes telles que getFullYear(), getMonth(), getDay(), etc. que vous pouvez utiliser pour extraire les composants spécifiques de la date de l'objet Date, tels que l'année, le jour du mois, le jour de la semaine, etc. respectivement. L'exemple suivant montre comment obtenir des composants spécifiques de la date à partir de l'objet Date en utilisant ces méthodes :
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript - Obtenir l'année, le mois et le jour à partir d'un objet date</title>
</head>
<body>
<script>
var d = new Date();
// Extraire des parties de la date
document.write(d.getDate() + "<br>"); // Affiche le jour du mois
document.write(d.getDay() + "<br>"); // Affiche le nombre de jours de la semaine (0-6)
document.write(d.getMonth() + "<br>"); // Affiche le nombre de mois dans l'année (0-11)
document.write(d.getFullYear()); // Afficher l'année complète (quatre chiffres)
</script>
</body>
</html>
La méthode getDay() renvoie un nombre représentant le jour de la semaine (de 0 à 6) au lieu de renvoyer un nom tel que dimanche ou lundi de telle sorte que, si c'est dimanche, la méthode renvoie 0 ; et si c'est lundi , la méthode renvoie 1, et ainsi de suite.
De même, la méthode getMonth() renvoie le nombre de mois (de 0 à 11) au lieu du nom du mois. Ici, 0 représente le premier mois de l'année. Par conséquent, si nous sommes en janvier, la méthode renvoie 0 et non 1 ; et si nous sommes en août, la méthode renvoie 7.
De même, l'objet Date fournit des méthodes telles que getHours(), getMinutes(), getSeconds(), getTimezoneOffset() etc. pour extraire les composantes temporelles de l'objet Date.
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>avaScript - Obtenir les heures, minutes et secondes d'un objet date</title>
</head>
<body>
<script>
var d = new Date();
// Extraction des parties du temps
document.write("Il est : "+d.getHours() + " heure <br> et "); // Affichage du nombre d'heures de la journée (0-23)
document.write(d.getMinutes() + "minutes <br> et "); // Affiche le nombre de minutes dans l'heure (0-59)
document.write(d.getSeconds() + " secondes <br> et "); // Affiche les secondes dans la minute (0-59)
document.write(d.getMilliseconds() + " milisecondes <br>"); // Affiche le nombre de millisecondes en seconde (0-999)
document.write("DEpuis le 1/1/1970 à ce moment il est passé "+d.getTime() + " milisecondes <br>"); // Afficher le nombre de millisecondes depuis le 1/1/1970 à 00:00:00:000
document.write("Le décalage du fuseau horaire est "+d.getTimezoneOffset() +" minutes"); // Affichez le décalage du fuseau horaire (par rapport au temps moyen de Greenwich) en minutes.
</script>
</body>
</html>
Remarque : Les objets Date disposent également de méthodes permettant d'obtenir les composantes UTC. Il suffit de placer UTC après get, comme getUTCDate(), getUTCHour(), getUTCMinutes(), et ainsi de suite.
Outre la récupération des valeurs de date et d'heure, vous pouvez également définir ou modifier ces valeurs à l'aide du JavaScript. Ceci est le plus souvent utilisé dans les programmes où vous devez changer la valeur d'un objet date d'une date ou d'une heure particulière à une autre. Voyons comment cela fonctionne.
Réglage de l'année, du mois et de la date L'objet Date fournit des méthodes telles que setFullYear(), setMonth() et setDate() pour définir respectivement les composants année, mois et date de l'objet Date.
Par exemple, dans l'exemple suivant, nous avons utilisé la méthode setFullYear() pour modifier la date actuelle stockée dans une variable deux ans plus tard.
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript définit la valeur de l'année d'un objet date</title>
</head>
<body>
<script>
var madate = new Date();
madate.setFullYear(madate.getFullYear() + 2);
document.write("Dans deux ans il sera : "+madate); // Affiche une date future de deux années
</script>
</body>
</html>
Nous pouvons facilement manoeuvrer la date en employant les méthodes disponibles pour l'objet date. Dans l'exemple ci-dessous nous avons placé un objet date à une date spécifique (le 4 october 2010) :
var maDate=new Date();
maDate.setFullYear(2030,9,4);
Et dans l'exemple suivant nous avons placé un objet date pour être de 15 jours dans le futur :
var maDate=new Date();
maDate.setDate(maDate.getDate()+15);
Note : Si on ajoute 15 jours à une date, les changements du décalage du mois ou de l'année, sont manipulés automatiquement par l'objet date lui-même !
L'objet date est également employé pour comparer deux dates.
L'exemple suivant compare la date d'aujourd'hui au 14 janvier 2010 :
Exemple : Copier le code
var maDate=new Date();
maDate.setFullYear(2010,0,14);
var aujourdhui = new Date();
if (maDate > aujourdhui)
{
alert("Aujourd’hui est après le 14 janvier 2010");
}
else
{
alert("Aujourd’hui est avant le 14 janvier 2010");
}
Exemples :
Voici quelques exemples pour manipuler l’objet date.
Exemple comment afficher une horloge
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript Affichage d'une horloge</title>
<script">
function startTime()
{//on récupère la date courante
var aujourdhui=new Date();
// on extrait l'heure, les minute et les secondes
var h=aujourdhui.getHours();
var m=aujourdhui.getMinutes();
var s=aujourdhui.getSeconds();
m=checkTime(m);
s=checkTime(s);
//affichage dans l'élément du document qui a un id="txt" sous forme de texte
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
//on rafrichi le temps tous les 500 millisecondes
t=setTimeout('startTime()',500);
}
// ajouter un zéro si le nombre est inférieur à 10
function checkTime(i)
{
if (i<10)
{
i="0" + i;
}
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>
Exemple : JavaScript comment afficher les jours de la semaine en français
Exemple : Copier le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript affichage des jours de la semaine en français </title
<body>
<script">
var d=new Date();
var jourDeSemaine=new Array(7);
jourDeSemaine[0]="Dimanche";
jourDeSemaine[1]="lundi";
jourDeSemaine[2]="Mardi";
jourDeSemaine[3]="Mercredi";
jourDeSemaine[4]="Jeudi";
jourDeSemaine[5]="Vendredi";
jourDeSemaine[6]="Samedi";
/*affichage des jours de la semaine en français*/
document.write("Aujourd'hui c'est " + jourDeSemaine[d.getDay()]);
</script>
</body>
</html>
On peut faire la même chose pour afficher les mois de l'année en français
Comment afficher les mois de l'année en français
Code
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>JavaScript affichage des moiss de l'année en français </title
<body>
<script">
var d=new Date();
var moisDeAnnee=new Array(12);
moisDeAnnee[0]="Janvier";
moisDeAnnee[1]="Février";
moisDeAnnee[2]="Mars";
moisDeAnnee[3]="Avril";
moisDeAnnee[4]="Mai";
moisDeAnnee[5]="Juin";
moisDeAnnee[6]="Juillet";
moisDeAnnee[7]="Aout";
moisDeAnnee[8]="Septembre";
moisDeAnnee[9]="Octobre";
moisDeAnnee[10]="Novembre";
moisDeAnnee[11]="Décembre";
/*affichage des mois de l'année en français*/
document.write("le mois courant est : " + moisDeAnnee[d.getMonth()]);
/*Affichge du mois pour une date présisée*/
var maDate=new Date(2010,3,25);
document.write("<hr>Il s'agit de : " + moisDeAnnee[maDate.getMonth()]);
</script>
</body>
</html>
Exemple comment afficher le temps en millisecondes depuis 1970
Exemple : Copier le code
<html> <body> <script"> var d=new Date(); document.write(d.getTime() + " millisecondes depuis le 01/01/1970"); </script> </body> </html>
Exemple comment afficher la date complète du jour
Exemple : Copier le code
<html> <body> <script"> var d=new Date(); document.write(d); </script> </body> </html>
|
Cours precedent: |
Sommaire : |
Cours suivant: |