Get Todays's Date in HTML

1. Use the JavaScript Date() Function to Get the Current Date in HTML
2. Get the Current Date in the y/m/d Format in HTML
3. Get the Current Date Using the JavaScript Method toLocaleDateString() in HTML

In this article, we will introduce a few methods to get the current date in HTML.

Use the JavaScript Date() Function to Get the Current Date in HTML

We can use the JavaScript Date() function to get the current date. The function returns the current date and time. We can create an HTML container and display the current date in it using JavaScript. We will use the innerHTML property to write the date in HTML.

For Example, create a div and set current_date as its id. Then, write some JavaScript inside the script tag. Select the current_id using the getElementById property and call the Date() function. Use the innerHTML property to write the returned date in HTML.

The example below will display the current date and time as shown in the output section below. The output contains the day of the week, month, day, year, hour, minute, second, and the GMT and the information about the location.

Example Code:

<div id="current_date"></p>
<script>
document.getElementById("current_date").innerHTML = Date();
</script>

Output:

Mon Nov 01 2021 09:22:43 GMT+0545 (Nepal Time) 

Get the Current Date in the y/m/d Format in HTML

We can also find the current date in y/m/d format using the various JavaScript Date() methods. We can get the current year from the getFullYear() method, the current month from the getMonth() method and the current day from the getDate() method. In this method, we will use the Date() object to access these various functions. We can format the date in any way we want and display it on an HTML page using the innerHTML property.

For example, create a div with the same id as in the method above. In JavaScript, create a date object of the Date() class. Next, create three variables year, month and day. Use the date object to call the methods getFullYear(), getMonth() and getDate(), and store in those respective variables. Next, use the document object and call the getElementById property to select the id of the div. Next, set the innerHTML to the variables month, day and year separated by a slash.

In this way, we can get the current date in m/d/y format in HTML using the JavaScript Date() class.

Example Code:

<div id="current_date"></p>
<script>
date = new Date();
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
document.getElementById("current_date").innerHTML = month + "/" + day + "/" + year;
</script>

Output:

11/1/2021

Get the Current Date Using the JavaScript Method toLocaleDateString() in HTML

We can use the JavaScript function toLocaleDateString() to find the current date. The toLocaleDateString() function returns the current date according to the language provided in the function. There are various language-specific conventions, and we can define the language with the toLocaleDateString() function. The function takes two parameters which are locales and options. We can specify the language of the output by the locales option. For example, we can use en-US for US English and en-GB for British English.

For example, create a div and write JavaScript inside the script tag. Creae a date object of the Date() class and call the method toLocaleDateString(). Next, use document.write() to display the date variable.

We can see the output in the m/d/y format. Thus, we can use the toLocaleDateString() method to find the current date in HTML.

Example Code:

<div>
<script>
date = new Date().toLocaleDateString();
document.write(date);
</script>
</div>

Output:

11/1/2021