Print current day and time using HTML and JavaScript

Print current day and time using HTML and JavaScript

Last Updated : 30 Sep, 2024

Printing the current day and time using HTML and JavaScript involves dynamically displaying the present date and time on a webpage. JavaScript's Date object is used to retrieve the current day, month, year, and time, which is then embedded in the HTML content.

Approach:

Retrieve Current Date and Day: Use the new Date() to get the current date and getDay() to retrieve the day's index (0 for Sunday).
An array of Weekdays: Map the day's index to a weekday array, which contains the names of the days, to display the correct day.
Get Time Components: Extract hours using getHours() and convert them to 12-hour format. Also, retrieve minutes using getMinutes().
AM/PM Determination: Determine whether it's AM or PM using a conditional check, adjusting the hour if necessary for the 12-hour format.
Display Time and Day: Use document.write() to display the current day and formatted time, including the hour, minutes, and milliseconds.

Example: In this example we are following the above-explained approach.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>
        print current day and time
    </title>
</head>

<body>
    <script type="text/javascript">
        let myDate = new Date();
        let myDay = myDate.getDay();

        // Array of days. 
        let weekday = ['Sunday', 'Monday', 'Tuesday',
            'Wednesday', 'Thursday', 'Friday', 'Saturday'
        ];
        document.write("Today is : " + weekday[myDay]);
        document.write("<br/>");

        // get hour value. 
        let hours = myDate.getHours();
        let ampm = hours >= 12 ? 'PM' : 'AM';
        hours = hours % 12;
        hours = hours ? hours : 12;
        let minutes = myDate.getMinutes();
        minutes = minutes < 10 ? '0' + minutes : minutes;
        let myTime = hours + " " + ampm + " : " + minutes +
            " : " + myDate.getMilliseconds();
        document.write("\tCurrent time is : " + myTime); 
    </script>
</body>

</html>

Output:

time-and-date — current day and time using HTML and JavaScript Example Output

Print current day and time using HTML and JavaScript

A

AnmolAgarwal

Improve

Article Tags :

Similar Reads

HTML stands for HyperText Markup Language. It is the standard language used to create and structure content on the web. It tells the web browser how to display text, links, images, and other forms of multimedia on a webpage. HTML sets up the basic structure of a website, and then CSS and JavaScript

HTML Interview Questions and Answers

HTML (HyperText Markup Language) is the foundational language for creating web pages and web applications. Whether you're a fresher or an experienced professional, preparing for an HTML interview requires a solid understanding of both basic and advanced concepts. Below is a curated list of 50+ HTML

Top 10 Projects For Beginners To Practice HTML and CSS Skills

Learning to code is an exciting journey, especially when stepping into the world of programming with HTML and CSSâ€”the foundation of every website you see today. For most beginners, these two building blocks are the perfect starting point to explore the creative side of web development, designing vis

HTML Introduction

HTML stands for Hyper Text Markup Language, which is the core language used to structure content on the web. It organizes text, images, links, and media using tags and elements that browsers can interpret. As of 2025, over 95% of websites rely on HTML alongside CSS and JavaScript, making it a fundam

HTML Tags - A to Z List

HTML Tags are fundamental elements used to structure and format content on web pages. They provide instructions to web browsers on how to render text, images, links, and other media.HTML tags are enclosed in angle brackets < > and usually come in pairs: an opening tag and a closing tag. The cl

HTML DOCTYPE Declaration

HTML DOCTYPE (Document Type Declaration) is an instruction that appears at the beginning of an HTML document, before the <html> tag.Its primary role is to tell the web browser which version of HTML the page is written in, ensuring that the browser renders the content correctly. It is not an HT

30+ Web Development Projects with Source Code [2025]

Web development is one of the most in-demand career paths in the IT industry, experiencing consistent growth of around 20â€“25% annually. Whether you're a student starting out or an experienced professional looking to switch or advance your career, it's essential to go beyond theory and demonstrate yo

Frontend Developer Interview Questions and Answers

Frontend development is an important part of web applications, and it is used to build dynamic and user-friendly web applications with an interactive user interface (UI). Many companies are hiring skilled Frontend developers with expertise in HTML, CSS, JavaScript, and modern frameworks and librarie

HTML forms, defined using the <form> Tags are essential for collecting user input on web pages. They incorporate a variety of interactive controls such as text fields, numeric inputs, email fields, password fields, checkboxes, radio buttons, and submit buttons. Over 85% of websites rely on for

HTML (HyperText Markup Language) is the standard markup language used to create and structure web pages. It defines the layout of a webpage using elements and tags, allowing for the display of text, images, links, and multimedia content. As the foundation of nearly all websites, HTML is used in over