Comment insérer la date et l'heure dans un site web (JavaScript/HTML)

Afficher la date et l'heure actuelles sur un site web garantit qu'au moins un élément change à chaque actualisation de la page par le visiteur. Pas besoin d'apprendre PHP, Java ou ASP.NET. Avec JavaScript et du HTML basique, vous pouvez insérer la date et l'heure en quelques lignes de code.

Étape 1

Ouvrez une de vos pages web avec le Bloc-notes, un éditeur HTML ou toute application produisant du texte brut. Pour conserver une copie du code original, dupliquez le fichier avant modification.

Étape 2

Ajoutez le code suivant juste après la première balise <body> de votre HTML :

<div id="datetime"></div>

Cela crée un bloc div vide.

Étape 3

Ajoutez le code suivant juste avant la balise de fermeture </head> :

<script type="text/javascript">
window.onload = function() {
  var dateTime = new Date();
  var separator = " - ";
  var formattedDateTime = dateTime.toLocaleDateString() + separator + dateTime.toLocaleTimeString();
  document.getElementById("datetime").innerHTML = formattedDateTime;
}
</script>

Cette fonction JavaScript s'exécute au chargement de la page. La variable dateTime contient la date/heure système. formattedDateTime la décompose en deux valeurs formatées (date et heure) séparées par le caractère défini dans separator. Les deux dernières lignes injectent la chaîne formatée dans la balise div définie dans le corps HTML.

Étape 4

Enregistrez le document et ouvrez-le dans votre navigateur. La date et l'heure apparaissent à l'emplacement du div. Rechargez la page pour voir les valeurs changer.

Conseil

La variable separator peut contenir n'importe quel caractère. Cet exemple utilise un tiret.