On this page I give a script to print out the present time and date, both in 24hrs format and in am/pm format. Many people want this on their website, no doubt because otherwise surfers would completely forget what time and date it is.
First of all a reminder: this script prints out the date and time according to the system the browser is on. If this system time is wrong, there's nothing you can do about it.
Below you should see the correct time and date according to your system. If something is not correct, please tell me what browser you're using and what you are seeing.
It's 08:05:29 on Saturday 11-01-2025
It's 08:05:29 am on Saturday 01-11-2025
This is the script for 24hrs format. Later I'll give the addition you need for am/pm format.
var Days = new Array('Sunday','Monday','Tuesday','Wednesday', 'Thursday','Friday','Saturday'); var today = new Date(); var Year = takeYear(today); var Month = leadingZero(today.getMonth()+1); var DayName = Days[today.getDay()]; var Day = leadingZero(today.getDate()); var Hours = leadingZero(today.getHours()); var Minutes = leadingZero(today.getMinutes()); var Seconds = leadingZero(today.getSeconds()); function takeYear(theDate) { x = theDate.getYear(); var y = x % 100; y += (y < 38) ? 2000 : 1900; return y; } function leadingZero(nr) { if (nr < 10) nr = "0" + nr; return nr; }
As explained on the Introduction page, first we create a Date object and then we read out various bits of information:
var today = new Date(); var Year = takeYear(today); var Month = leadingZero(today.getMonth()+1); var DayName = Days[today.getDay()]; var Day = leadingZero(today.getDate()); var Hours = leadingZero(today.getHours()); var Minutes = leadingZero(today.getMinutes()); var Seconds = leadingZero(today.getSeconds());
I wanted to make the information more user friendly, so the code has become slightly more complex. I added the following things to the basic methods:
First of all, I want to add a "0" to each number that's smaller than 10. I use this function:
function leadingZero(nr) { if (nr < 10) nr = "0" + nr; return nr; }
I give it a number and if the number is smaller than 10, it adds a "0" in front of it. It then returns the number to whatever JavaScript line asked for it. So when I calculate the seconds number, I do
var Seconds = leadingZero(today.getSeconds());
First I do today.getSeconds(), then I send the resulting number through leadingZero() and only then I put the number in Seconds for output to the screen later on.
I want to print out the name of the day, so I need an extra array that stores the names of the days:
var Days = new Array('Sunday','Monday','Tuesday','Wednesday', 'Thursday','Friday','Saturday');
Sunday is day 0, Saturday is day 6, both in the array and in the Date() object. today.getDay() gives us the day number and we take the corresponding name from the array Days[].
var DayName = Days[today.getDay()];
The months are numbered from 0 to 11. If you only want to print out the month number, add 1 to today.getMonth().
var Month = leadingZero(today.getMonth()+1);
If you want to print out the name of the month, make an array Months[] and do the same as for the names of the days:
var Month = Months[today.getMonth()];
As explained on the Introduction page we need this function to read out the correct year:
function takeYear(theDate) { x = theDate.getYear(); var y = x % 100; y += (y < 38) ? 2000 : 1900; return y; }
and call it like
var Year = takeYear(today);
Finally, what to do if you want the output formatted in am/pm. You need to check the Hours and add an extra variable, ampm that is either "am" or "pm".
Replace
var Hours = leadingZero(today.getHours());
by
var Hours = today.getHours(); var ampm = "am"; if (Hours == 0) Hours = 12; if (Hours > 11) ampm = "pm"; if (Hours > 12) Hours -= 12; Hours = leadingZero(Hours);
A reader pointed out that, even though at 12:00 hours the day is Post Meridiem, nonetheless
time in the twelfth hour itself is written as 12:01 pm, not as 0:01 pm. So this script treats
the time as such.
The same goes for the first hour of the day, it isn't 0:01 am but 12:01 am.
If Hours is 0, it should be read as 12:xx am.
If Hours is larger than 11, set ampm to pm. If in addition Hours is
larger than 12,
subtract 12 from it and set ampm to "pm". Send the
number through leadingZero() only after the if() statement.
Finally, document.write the date in the format you like. For instance:
document.write (Hours + ':' + Minutes + ':' + Seconds + ' ' + DayName + ' ' + Day + '-' + Month + '-' + Year);
for European format or
document.write (Hours + ':' + Minutes + ':' + Seconds + ' ' + ampm + ' ' + DayName + ' ' + Month + '-' + Day + '-' + Year);
for American format.
(document.write commands should always be on one line. I wrapped the lines only to make them more legible. Don't do this in your source code)