FAQ JavaScriptConsultez toutes les FAQ
Nombre d'auteurs : 43, nombre de questions : 175, dernière mise à jour : 6 décembre 2013
Sommaire→La gestion des dates (l'objet Date)- Comment afficher la date ou l'heure en temps réel ?
- Comment comparer deux dates ?
- Comment vérifier si un champ qui contient la date et l'heure au format (aaaa-mm-jj hh:mm:ss) est bien rempli ?
- Comment convertir une date JavaScript en français ?
- Comment déterminer si une année est bissextile ?
- Comment calculer le nombre de jours entre deux dates ?
- Comment déterminer la date d'il y a 6 mois ?
- Quelle est la différence entre setFullYear et setUTCFullYear ?
L'objet Date() contient 4 fonctions qui permettent d'afficher l'heure et le jour selon les cas. Les 4 fonctions qui affichent l'heure sont :
- toString() : date en anglais, heure (hh:mm:ss) et fuseau horaire ;
- toTimeString() : heure (hh:mm:ss) au format 24h si navigateur en français et fuseau horaire ;
- toLocaleString() : date dans la langue du système, heure (hh:mm:ss) au format 24h si navigateur en français ;
- toLocaleTimeString() : heure (hh:mm:ss) au format 24h si navigateur en français.
Exemple : afficher l'heure du système et la mettre à jour toutes les secondes.
function horloge()
{
var tt = new Date().toLocaleTimeString(); // hh:mm:ss
document.getElementById("timer").innerHTML = tt;
setTimeout(horloge, 1000); // mise à jour du contenu "timer" toutes les secondes
}Et voici la zone d'affichage :
<div id="timer"></div>La fonction est appelée, par exemple, de la manière suivante :
<body onload="horloge();">Voici une technique permettant de comparer deux dates :
// Mise en place de la première date
var d1 = new Date(2006,11,27);
// Mise en place de la seconde date
var d2 = new Date(2006, 0, 18);
if (d1 > d2)
{
alert("d1 est après d2");
}
else if (d1 < d2)
{
alert("d1 est avant d2");
}
else
{
alert("d1 et d2 sont la même date");
}Nous pouvons pousser un peu plus la précision de la comparaison en ajoutant l'heure de la date :
var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);Lien : Exemple d'utilisation de ce script
Lien : Pour en savoir plus sur les
arguments de l'objet Date()
objet Date()
// date au format dd-mm-yyyy hh:mm:ss (fr)
// date au format yyyy-mm-dd hh:mm:ss (en)
function isGoodDate(mydate, format)
{
var thedate, day, month, year;
var onedate;
var thetime, hours, minutes, seconds;
var onetime;
var mysplit=mydate.split(' ');
if (mysplit.length != 2)
{
return false;
}
thedate=mysplit[0].split('-');
if (format=="en")
{
year = parseInt(thedate[0],10);
month = parseInt(thedate[1],10);
day = parseInt(thedate[2],10);
if ((mysplit[0].length != 10) || (thedate.length != 3) ||
(isNaN(year)) || (isNaN(month)) || (isNaN(day)) ||
(thedate[0].length < 4) || (thedate[1].length < 2) || (thedate[2].length < 2))
{
return false;
}
}
else if (format=="fr")
{
day = parseInt(thedate[0],10);
month = parseInt(thedate[1],10);
year = parseInt(thedate[2],10);
if ((mysplit[0].length != 10) || (thedate.length != 3) ||
(isNaN(year)) || (isNaN(month)) || (isNaN(day)) ||
(thedate[0].length < 2) || (thedate[1].length < 2) || (thedate[2].length < 4))
{
return false;
}
}
else
{
return false;
}
onedate = new Date(year, month-1, day);
year = onedate.getFullYear();
if ((onedate.getDate() != day) ||
(onedate.getMonth() != month-1) ||
(onedate.getFullYear() != year ))
{
return false;
}
thetime = mysplit[1].split(':');
hours = parseInt(thetime[0],10);
minutes = parseInt(thetime[1],10);
seconds = parseInt(thetime[2],10);
if ((mysplit[1].length != 8) || (thetime.length != 3)||
(isNaN(hours)) || (isNaN(minutes)) || (isNaN(seconds)) ||
(thetime[0].length < 2) || (thetime[1].length < 2) || (thetime[2].length < 2))
{
return false;
}
onetime = new Date(year, month-1, day, hours, minutes, seconds);
if ((onetime.getHours() != hours) || (onetime.getMinutes() != minutes) || (onetime.getSeconds() != seconds))
{
return false;
}
return true;
}La fonction prend un paramètre supplémentaire qui s'appelle format. Sa valeur est soit "fr" soit "en".
isGoodDate("18-11-2012 11:36:00", "fr");
retournera true.
isGoodDate("18-11-2012 11:36:00", "en");
retournera false.
isGoodDate("2012-11-18 11:36:00", "fr");
retournera false.
isGoodDate("2012-11-18 11:36:00", "en");
retournera true.
Dans le cas où le second paramètre n'est ni "fr" ni "en" la fonction retournera false. Tout ceci sous réserve que la chaîne passée contienne effectivement une date et une heure valides.
Lien : D'autres fonctions possibles
Lorsque l'on veut afficher une date en JavaScript, on est souvent confronté aux problèmes d'internationalisation. En effet, un code du type alert(new Date()) affiche un résultat de ce genre :
Fri Oct 09 2009 00:00:00 GMT+0200Il s'agit certes de la bonne date, mais malheureusement pas au format que l'on a envie d'afficher !
Pour convertir cette date en format français, il suffit tout simplement d'utiliser la méthode toLocaleString() de l'objet Date() :
var ceJour = new Date();
alert(ceJour.toLocaleString());Attention, cette méthode dépend des paramètres linguistiques du système d'exploitation !
Il existe des tests connus pour savoir si une année est bissextile ou non. Le problème qui se pose souvent vient de la gestion des années multiples de 10. Pour gérer ces cas, on en arrive rapidement à des algorithmes compliqués.
Encore une fois, en utilisant l'objet Date de JavaScript, la solution devient très simple.
var annee = prompt('Année ?')
alert(new Date(annee,2,0).getDate());Ce code prend en compte que lorsqu'on définit une date incohérente, JavaScript se débrouille pour l'ajuster en une date existante.
Dans cet exemple, le 0e jour de mars deviendra donc le dernier jour de février, ce qu'affiche la boîte alert.
Il devient donc facile d'augmenter les prototypes des objets Number et Date :
Number.prototype.isBissextile=function(){
return (new Date(this,2,0).getDate()>=29);
}
alert((2016).isBissextile());Date.prototype.isBissextile=function(){
return (new Date(this.getFullYear(),2,0).getDate()>=29);
}
var today = new Date();
today.setFullYear(2012);
alert(today.isBissextile());Si vous souhaitez calculer le nombre de jours séparant deux dates données, cette fonction fera votre bonheur :
function diffdate(d1,d2){
var WNbJours = d2.getTime() - d1.getTime();
return Math.ceil(WNbJours/(1000*60*60*24));
}Explication
:
d1
et
d2
étant deux dates, la méthode
getTime()
retourne le nombre de millisecondes écoulées depuis le 1er janvier 1970.
Il suffit donc de soustraire les deux valeurs et de convertir le nombre de millisecondes obtenues en jours (1000 => secondes, 60 => minutes, 60 => heures, 24 =>
jours).
Exemple d'utilisation de ce code :
var Date1 = new Date(2010,0,1);
var Date2 = new Date(2011,0,1);
alert(diffdate(Date1,Date2) + ' jours');Vous pouvez bien sûr enrichir cette fonction en spécifiant le l'unité de temps à renvoyer :
function diffdate(d1,d2,u){
var div=1;
switch(u){
case 's':
div=1000;
break;
case 'm':
div=1000*60;
break;
case 'h':
div=1000*60*60;
break;
case 'd':
div=1000*60*60*24;
break;
}
var Diff = d2.getTime() - d1.getTime();
return Math.ceil(Diff/div);
}
var Date1 = new Date(2010,0,1);
var Date2 = new Date(2011,0,1);
alert(diffdate(Date1,Date2,'d') + ' jours\n'+diffdate(Date1,Date2,'h')
+ ' heures\n'+diffdate(Date1,Date2,'m')
+ ' minutes\n'+diffdate(Date1,Date2,'s')
+ ' secondes\n'+ diffdate(Date1,Date2,'')
+ ' millisecondes');Si vous avez besoin de récupérer la date d'il y a six mois, la solution simple qui vient en première intention est de retrancher les six mois à la date du jour :
var last6 = new Date();
last6.setMonth(today.getMonth()-6);
Bien que satisfaisante dans la plupart des cas, cette solution ne l'est plus pour les derniers jours du mois.
En effet, si l'on prend par exemple le 31 août, le code précédent affectera à la variable la date du 31 février et comme cette date n'existe pas, elle sera
rectifiée par JavaScript en 2 ou 3 mars (selon que l'année est bissextile ou non), or, dans ce genre de cas, c'est bien le dernier jour de février que l'on
cherche.
Il va donc falloir utiliser l'astuce suivante :
- nous allons fixer la date au jour 0 du 5e mois précédent, ce qui aura pour effet d'ajuster la date au dernier jour du mois -6 ;
- affecter le jour à la plus petite valeur entre la date du jour et le dernier jour d'il y a six mois en utilisant l'objetMath().
var today = new Date();
var last6 = new Date(today.getFullYear(),today.getMonth()-5,0);
last6.setDate(Math.min(today.getDate(),last6.getDate()));La méthode setFullYear() permet de positionner l'année de l'objet Date() sur 4 caractères.
var d = new Date();
d.setFullYear(2013);En fait la méthode permet également de positionner le mois et le jour car sa signature complète est setFullYear(annee, mois, jour). Les deux derniers paramètres étant optionnels.
La méthode setUTCFullYear() permet elle aussi de positionner l'année de l'objet Date() sur 4 caractères mais selon l'heureUTC/GMT. Elle s'utilise de la même manière et accepte également le mois et le jour.
UTC : Universal Coordinated Time, est une échelle de temps adoptée par la plupart des pays comme étant la base du temps civil international.