Display Current Date and Time in Html using Javascript

Display Current Date and Time in HTML using JavaScript

In this tutorial, you will learn how to display current system date and time in HTML using JavaScript.

Will take an example to display current Date and Time in H2 html tag with using javascript document.getElementById(“ID”).innerHTML. As well as display current day name.

JavaScript Code to Display Current System Date and Time

JavaScript Code

var today = new Date(); var day = today.getDay(); var daylist = ["Sunday","Monday","Tuesday","Wednesday ","Thursday","Friday","Saturday"]; var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate(); var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); var dateTime = date+' '+time; document.getElementById("displayDateTime").innerHTML = dateTime + ' 
Day :- ' + daylist[day];

HTML Source Code with JavaScript

    

Get current date using JavaScript.

var today = new Date(); var day = today.getDay(); var daylist = ["Sunday","Monday","Tuesday","Wednesday ","Thursday","Friday","Saturday"]; var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate(); var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); var dateTime = date+' '+time; document.getElementById("displayDateTime").innerHTML = dateTime + '
Day :- ' + daylist[day];

You can learn more about the JavaScript date and time methods:

Get Current Date & Time in JavaScript

Use Date() method to create an object in JavaScript with current date and time. This provides output in UTC timezone.

1. Current Date in JavaScript

Use the following script to get the current date using JavaScript in “Y-m-d” format.

var today = new Date(); var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
  • getFullYear() – Provides current year like 2020.
  • getMonth() – Provides current month values 0-11. Where 0 for Jan and 11 for Dec. So added +1 to get result.
  • getDate() – Provides day of the month values 1-31.
Читайте также:  Install all python packages ubuntu

2. Current Time in JavaScript

Use the following script to get the current time using JavaScript in “H:i:s” format.

var today = new Date(); var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
  • getHours() – Provides current hour between 0-23.
  • getMinutes() – Provides current minutes between 0-59.
  • getSeconds() – Provides current seconds between 0-59.

3. Current Date & Time Both in JavaScript

Use the following script to get the current date and time using JavaScript in “Y-m-d H:i:s” format. You can simply combine the output of the above JavaScript code in one variable as below:

var today = new Date(); var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate(); var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); var dateTime = date+' '+time;

Источник

Скрипт текущей даты и времени (идущие часы)

Для того, чтобы посетители и пользователи Вашего сайта могли наблюдать текущую дату и время, воспользуйтесь нашим простым JavaScript кодом, приведенным чуть ниже. Для этого необходимо сначала на JavaScript описать в начале Вашей странички функцию генерирования текущего времени и даты clock() следующим образом:

< script type = "text/javascript" >
function clock () var d = new Date ();
var month_num = d . getMonth ()
var day = d . getDate ();
var hours = d . getHours ();
var minutes = d . getMinutes ();
var seconds = d . getSeconds ();

month =new Array( «января» , «февраля» , «марта» , «апреля» , «мая» , «июня» ,
«июля» , «августа» , «сентября» , «октября» , «ноября» , «декабря» );

date_time = «Сегодня — » + day + » » + month [ month_num ] + » » + d . getFullYear () +
» г.   Текущее время — » + hours + «:» + minutes + «:» + seconds ;
if ( document . layers ) document . layers . doc_time . document . write ( date_time );
document . layers . doc_time . document . close ();
>
else document . getElementById ( «doc_time» ). innerHTML = date_time ;
setTimeout ( «clock()» , 1000 );
>

Читайте также:  Add all values in array php

Далее в заданном месте Вашей странички (там, где будет выводиться дата и время) необходимо добавить следующий HTML код:

После этого необходимо запустить нашу функцию генерации и отображения текущей даты и времени следующим образом:

В результате добавления данного скрипта на свой сайт Вы получите идущие часы, отображающие текущую дату и время. Пример работы данного скрипта Вы можете наблюдать вверху нашего сайта слева над боковым меню.

Если Вам необходимо показывать статичное время (время, когда была сгенерирована странички), то рекомендуем Вам воспользоваться скриптом попроще, приведенным в теме Простой PHP скрипт, отображающий текущую дату и время.

Источник

Оцените статью