DEV Community

Zoya Khan
Zoya Khan

Posted on

HTML Code for Date and Time Tool

#html #beginners #tooling #codereview 
<!DOCTYPE html>
<html>
  <head>
    <title>Current Date and Time</title>
  </head>
  <body>
    <h1>Current Date and Time</h1>
    <p>
      The current date and time is: <span id="datetime"></span>
    </p>
    <script>
      var datetimeElement = document.getElementById("datetime");
      var now = new Date();
      datetimeElement.textContent = now.toString();
    </script>
  </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (2)

Collapse
 
nlxdodge profile image
NLxDoDge •

Maybe try to write some text before the code snippet as well, this way the reader who doesn't have experience knows what the code does 👍

Now with added color styling 😊
You can add litterally only html after the tree backticks on the same line like this:

Image description

Result:

<!DOCTYPE html>
<html>
  <head>
    <title>Current Date and Time</title>
  </head>
  <body>
    <h1>Current Date and Time</h1>
    <p>
      The current date and time is: <span id="datetime"></span>
    </p>
    <script>
      var datetimeElement = document.getElementById("datetime");
      var now = new Date();
      datetimeElement.textContent = now.toString();
    </script>
  </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Happy Coding!

Collapse
 
zoyakhanblogger profile image
Zoya Khan •

thank you so much :)

Read next

foyzulkarim profile image

How Machine Learning Models Learn: A Journey from Basics to Foundation Models (2)

Foyzul Karim -

itsmanavhere profile image

Large Language Models (LLMs)

Manav Saxena -

arindam_1729 profile image

9 Open Source Libraries to Supercharge Your Next Project 🔋⚡️

Arindam Majumder -

harold_defree profile image

Month 1: The Kickoff – Building the Foundation

Harold Defree -