Date and time

The day names do not work in Netscape 2.

Explorer on Mac does not take daylight saving time into account. One reader even reported a 7 hour difference between real time and Explorer on Mac time.

I've heard, but not tested, that Escape and Ice Browser don't take daylight saving time into account.

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.

Example

Below you should see the correct time and date according to your system in European and American format. If it doesn't match your system time, please tell me what browser you're using and what you are seeing.

The script

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;
}

Explanation

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:

leadingZero()

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.

The day name

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 month

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()];

The year

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);

am and pm

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. Send the number through leadingZero() only after the if() statement.

Output

Finally, document.write the date in the format you like. For European format do

document.write (Hours + ':' + Minutes + ':' + Seconds + ' '
	+  DayName + ' ' + Day + '-' + Month + '-' + Year);

For American format do

document.write (Hours + ':' + Minutes + ':' + Seconds + ' ' + ampm
	+ ' ' +  DayName + ' ' + Month + '-' + Day + '-' + Year);

(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)