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

Pouvez-vous s'il vous plaît me dire comment régler l'heure dans ce format HH: MM: SS. Je veux définir cela dans un div?

function checkTime(i) {
  if (i < 10) {
    i = "0" + i;
  }
  return i;
}

function startTime() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var s = today.getSeconds();
  // add a zero in front of numbers<10
  m = checkTime(m);
  s = checkTime(s);
  document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
  t = setTimeout(function() {
    startTime()
  }, 500);
}
startTime();

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

DEMO utilisant javaScript uniquement

Mettre à jour

Updated Demo

(function () {
    function checkTime(i) {
        return (i < 10) ? "0" + i : i;
    }

    function startTime() {
        var today = new Date(),
            h = checkTime(today.getHours()),
            m = checkTime(today.getMinutes()),
            s = checkTime(today.getSeconds());
        document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
        t = setTimeout(function () {
            startTime()
        }, 500);
    }
    startTime();
})();

Vous pouvez utiliser la fonction native Date.toLocaleTimeString():

var d = new Date();
var n = d.toLocaleTimeString();

Cela affichera par exemple:

"11:33:01"

Je l'ai trouvé sur http://www.w3schools.com/jsref/jsref_tolocaletimestring.asp

var d = new Date();
var n = d.toLocaleTimeString();
alert("The time is: \n"+n);

Vous pouvez le faire en Javascript.

var time = new Date();
console.log(time.getHours() + ":" + time.getMinutes() + ":" + time.getSeconds());

À l'heure actuelle, il revient 15:5:18. Notez que si l'une des valeurs est inférieure à 10, elle s'affichera en utilisant un seul chiffre, pas deux.

Vérifiez cela dans JSFiddle

Mises à jour:
pour essayer les 0 avec le préfixe

var time = new Date();
console.log(
    ("0" + time.getHours()).slice(-2)   + ":" + 
    ("0" + time.getMinutes()).slice(-2) + ":" + 
    ("0" + time.getSeconds()).slice(-2));

Vous pouvez utiliser moment.js pour ce faire.

var now = new moment();
console.log(now.format("HH:mm:ss"));

Les sorties:

16:30:03

new Date().toTimeString().slice(0,8)

Notez que toLocaleTimeString () peut renvoyer quelque chose comme 9:00:00 AM.

Utilisez de cette façon:

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

Résultat: 18:56:31

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 manière très simple d'utiliser moment.js et setInterval .

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

Exemple de sortie

En utilisant une valeur setInterval()de 1000 ms ou 1 seconde, la sortie sera actualisée toutes les 1 seconde.

15:25:50

C'est ainsi que 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 vous utilisez setInterval() causerait des problèmes de performances.

SetInterval est-il consommateur d'UC?

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

Non, setInterval n'est pas gourmand en CPU en soi. Si vous avez beaucoup d'intervalles exécutés sur des cycles très courts (ou une opération très complexe exécutée sur un intervalle modérément long), cela peut facilement devenir gourmand en ressources processeur, 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 comme beaucoup de choses sur votre site peut ralentir les choses. 20 intervalles simultanés 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

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

Les it-ITparamètres régionaux remplissent l'heure si nécessaire et omettent PM ou AM01:33:01

Ce code affichera 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

Ceci est un exemple de la façon de définir l'heure dans un div (only_time) à l'aide de javascript.

function date_time() {
    var date = new Date();
    var am_pm = "AM";
    var hour = date.getHours();
    if(hour>=12){
        am_pm = "PM";
    }
    if (hour == 0) {
        hour = 12;
    }
    if(hour>12){
        hour = hour - 12;
    }
    if(hour<10){
        hour = "0"+hour;
    }

    var minute = date.getMinutes();
    if (minute<10){
        minute = "0"+minute;
    }
    var sec = date.getSeconds();
    if(sec<10){
        sec = "0"+sec;
    }

    document.getElementById("time").innerHTML =  hour+":"+minute+":"+sec+" "+am_pm;
}
setInterval(date_time,500);
<per>
<div class="date" id="time"></div>
</per>