Як показати поточний час у JavaScript у форматі HH: MM: SS?

Підкажіть, будь ласка, як встановити час у такому форматі HH: MM: SS .Я хочу встановити це в 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, використовуючи лише javaScript

Оновлення

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();
})();

Ви можете використовувати рідну функцію Date.toLocaleTimeString():

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

Тут відобразиться, наприклад:

"11:33:01"

Я знайшов його на http://www.w3schools.com/jsref/jsref_tolocaletimestring.asp

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

Ви можете зробити це в Javascript.

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

В даний час він повертається 15:5:18. Зверніть увагу, що якщо будь-яке із значень менше 10, вони відображатимуться з використанням лише однієї цифри, а не двох.

Перевірте це в JSFiddle

Оновлення:
Для префіксу 0 спробуйте

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

Ви можете використовувати moment.js для цього.

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

Виходи:

16:30:03

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

Зверніть увагу, що toLocaleTimeString () може повернути щось на зразок 9:00:00 AM.

Використовуйте цей спосіб:

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

Результат: 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>

Дуже простий спосіб за допомогою moment.js та setInterval .

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

Вибір зразка

Використовуючи setInterval()значення 1000 мс або 1 секунду, вихід буде оновлюватися кожні 1 секунду.

15:25:50 вечора

Ось як я використовую цей метод в одному зі своїх побічних проектів.

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

Можливо, вам цікаво, чи використання setInterval()може спричинити проблеми з продуктивністю.

Чи інтенсивний процесор setInterval?

Я не думаю, що setInterval по суті призведе до значних проблем із продуктивністю. Я підозрюю, що репутація може походити з більш ранньої ери, коли центральні процесори були менш потужними. ... - самотній день

Ні, setInterval сам по собі не є інтенсивним процесором. Якщо у вас багато інтервалів, що працюють на дуже коротких циклах (або дуже складна операція, що працює на помірно великому інтервалі), то це може легко стати інтенсивним процесором, залежно від того, що саме роблять ваші інтервали і як часто вони це роблять. ... - aroth

Але загалом використання setInterval дійсно подобається багато чого на вашому сайті може сповільнити ситуацію. 20 одночасних інтервалів запуску з більш-менш важкою роботою вплинуть на шоу. І знову ж таки .. ви дійсно можете зіпсувати будь-яку частину, я думаю, це не проблема setInterval. ... - jAndy

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

Місцеві it-ITналаштування, якщо потрібно, зазначають годину і пропускають PM або AM01:33:01

Цей код видасть поточний час у форматі HH: MM: SS у консолі, він враховує часові пояси 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

Це приклад того, як встановити час у div (only_time) за допомогою 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>