Comment afficher l'heure actuelle en JavaScript au format HH:MM:SS ?

Question

Comment afficher l'heure actuelle au format HH:MM:SS ?

Answer 1

Utilisez cette méthode :

var d = new Date();
localtime = d.toLocaleTimeString('en-US', { hour12: false });

Résultat : 18:56:31

Answer 2

function realtime() {

  let time = moment().format('h:mm:ss a');
  document.getElementById('time').innerHTML = time;

  setInterval(() => {
    time = moment().format('h:mm:ss a');
    document.getElementById('time').innerHTML = time;
  }, 1000)
}

realtime();

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>

<div id="time"></div>

Une façon très simple d'utiliser moment.js y setInterval .

setInterval(() => {
  moment().format('h:mm:ss a');
}, 1000)

Exemple de sortie

Utilisation de setInterval() réglé sur 1000ms ou 1 seconde, la sortie sera rafraîchie toutes les 1 seconde.

3:25:50 pm

Voici comment j'utilise cette méthode sur l'un de mes projets parallèles.

setInterval(() => {
  this.time = this.shared.time;
}, 1000)

Vous vous demandez peut-être si l'utilisation setInterval() causerait des problèmes de performance.

setInterval est-il gourmand en ressources CPU ?

Je ne pense pas que setInterval va intrinsèquement vous causer des problèmes de performance significatifs. Je soupçonne que la réputation vient d'une époque antérieure, lorsque les processeurs étaient moins puissants. ... - lonesomeday

Non, setInterval n'est pas gourmand en ressources CPU en soi. Si vous avez beaucoup d'intervalles fonctionnant sur des cycles très courts (ou une opération très complexe fonctionnant sur un intervalle modérément long), alors cela peut facilement devenir intensif en termes de CPU, en fonction de ce que font exactement vos intervalles et de la fréquence à laquelle ils le font. ... - aroth

Mais en général, utiliser setInterval vraiment beaucoup sur votre site peut ralentir les choses. 20 intervalles fonctionnant simultanément avec un travail plus ou moins lourd affecteront le spectacle. Et puis encore ... vous pouvez vraiment gâcher n'importe quelle partie, je suppose que ce n'est pas un problème de setInterval. ... - jAndy

Answer 3

Ce code va afficher l'heure actuelle au format HH:MM:SS dans la console, il prend en compte les fuseaux horaires GMT.

var currentTime = Date.now()
var GMT = -(new Date()).getTimezoneOffset()/60;
var totalSeconds = Math.floor(currentTime/1000);
seconds = ('0' + totalSeconds % 60).slice(-2);
var totalMinutes = Math.floor(totalSeconds/60);
minutes = ('0' + totalMinutes % 60).slice(-2);
var totalHours = Math.floor(totalMinutes/60);
hours = ('0' + (totalHours+GMT) % 24).slice(-2);
var timeDisplay = hours + ":" + minutes + ":" + seconds;
console.log(timeDisplay);
//Output is: 11:16:55

Answer 4

new Date().toLocaleTimeString('it-IT')

El it-IT locale permet de compléter l'heure si nécessaire et d'omettre PM ou AM. 01:33:01

Answer 5

Fonction d'horloge compacte :

setInterval(function() {
    let d = new Date()
    console.log(`${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}`)
}, 1000);