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.

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;

Источник

How to Get the Current Date and Time in JavaScript

The JavaScript Date prototype object creates a new method that will return the current date and time. In this snippet, we will explain how you can accomplish your task step by step.

How to Get the Current Date

The first thing is using the Date() function to create an object in JavaScript:

let currentDate = new Date()

Then you should use the following script to get the current date in the “m-d-y” format. You can change the format.

Javascript current date

let currentDate = new Date(); let cDay = currentDate.getDate() let cMonth = currentDate.getMonth() + 1 let cYear = currentDate.getFullYear() console.log(cDay); console.log(cMonth); console.log(cYear);

• getDate() – Provides the day of the month values 1-31.
• getMonth() – Provides the current month with 0-11 values (0 for Jan and 11 for Dec). You should add +1 to get result.
• getFullYear() – Provides the current year.

Javascript current date

let currentDate = new Date(); let cDay = currentDate.getDate(); let cMonth = currentDate.getMonth() + 1; let cYear = currentDate.getFullYear(); console.log(«» + cDay + «/» + cMonth + «/» + cYear + ««);

How to Get the Current Time

The Date object is used to get the current time in JavaScript.

Here is how you can get the time in “h:i:s” format. You can change the format whatever you wish.

Javascript get current time

let currentDate = new Date(); let time = currentDate.getHours() + «:» + currentDate.getMinutes() + «:» + currentDate.getSeconds(); console.log(time);

• getHours() – Provides the current hour from 0 to 23.
• getMinutes() – Provides the current minutes from 0 to 59.
• getSeconds() – Provides the current seconds from 0 to 59.

To combine date and time in a single variable run the following:

Javascript combine date and time

let current = new Date(); let cDate = current.getFullYear() + ‘-‘ + (current.getMonth() + 1) + ‘-‘ + current.getDate(); let cTime = current.getHours() + «:» + current.getMinutes() + «:» + current.getSeconds(); let dateTime = cDate + ‘ ‘ + cTime; console.log(dateTime);

Display the current time in HTML

To display the current time on the HTML page we should use the setInterval javascript built-in function to update time.

html> head> title>Show current time title> head> body> div id="currentTime"> div> script> const element = document.getElementById('currentTime'); setInterval(function ( ) < const currentDate = new Date(); element.innerText = currentDate.getHours() + ":" + currentDate.getMinutes() + ":" + currentDate.getSeconds(); >, 1000); script> body> html>

Date and Time

JavaScript provides a built-in object Date for handling operations related to all the date and time. You can use it for displaying the current date and time, creating a calendar, building a timer, etc.

When a Date object is created, it allows a number of methods to work on it. Most of them will enable you to get and set the year, month, day, hour, minute, second, and millisecond fields of the object.

Источник