X
HOME HTML5 CSS3 JAVASCRIPT SQL PHP5 JQUERY ANGULAR BOOTSTRAP3 XML MORE...
REFERENCES | EXAMPLES | FORUM | ABOUT

JavaScript Dates


The Date object lets you work with dates (years, months, days, minutes, seconds, milliseconds)


Displaying Dates

In this tutorial we use a script to display dates inside a <p> element with id="demo":

Example

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Date();
</script>

Try it Yourself »

The script above says: assign the value of Date() to the content (innerHTML) of the element with id="demo". 

Note You will learn how to display a date, in a more readable format, at the bottom of this page.
 


Creating Date Objects

The Date object lets us work with dates.

A date consists of a year, a month, a day, a minute, a second, and a millisecond.

Date objects are created with the new Date() constructor.

There are 4 ways of initiating a date:

new Date()
new Date(milliseconds)
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)

Using new Date(), creates a new date object with the current date and time:

Example

<script>
var d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

Try it Yourself »

Using new Date(date string), creates a new date object from the specified date and time:

Example

<script>
var d = new Date("October 13, 2014 11:13:00");
document.getElementById("demo").innerHTML = d;
</script>

Try it Yourself »

Using new Date(number), creates a new date object as zero time plus the number.

Zero time is 01 January 1970 00:00:00 UTC. The number is specified in milliseconds:

Example

<script>
var d = new Date(86400000);
document.getElementById("demo").innerHTML = d;
</script>

Try it Yourself »

Note JavaScript dates are calculated in milliseconds from 01 January, 1970 00:00:00 Universal Time (UTC).
One day contains 86,400,000 millisecond.

Using new Date(7 numbers), creates a new date object with the specified date and time:

The 7 numbers specify the year, month, day, hour, minute, second, and millisecond, in that order:

Example

<script>
var d = new Date(99,5,24,11,33,30,0);
document.getElementById("demo").innerHTML = d;
</script>

Try it Yourself »

Variants of the example above let us omit any of the last 4 parameters:

Example

<script>
var d = new Date(99,5,24);
document.getElementById("demo").innerHTML = d;
</script>

Try it Yourself »

Note JavaScript counts months from 0 to 11. January is 0. December is 11.


Date Methods

When a Date object is created, a number of methods allow you to operate on it.

Date methods allow you to get and set the year, month, day, hour, minute, second, and millisecond of objects, using either local time or UTC (universal, or GMT) time.

The next chapter, of this tutorial, covers the date object's methods.


Displaying Dates

When you display a date object in HTML, it is automatically converted to a string, with the toString() method.

Example

<p id="demo"></p>

<script>
d = new Date();
document.getElementById("demo").innerHTML = d;
</script>

Is the same as:

<p id="demo"></p>

<script>
d = new Date();
document.getElementById("demo").innerHTML = d.toString();
</script>

Try it Yourself »

The toUTCString() method converts a date to a UTC string (a date display standard).

Example

<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.toUTCString();
</script>

Try it Yourself »

The toDateString() method converts a date to a more readable format:

Example

<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.toDateString();
</script>

Try it Yourself »

Note Date objects are static, not dynamic. The computer time is ticking, but date objects, once created, are not.



Your suggestion:

Close [X]

Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

WEB HOSTING

UK Reseller Hosting

WEB BUILDING

Download XML Editor FREE Website BUILDER Free HTML5 Templates

SHARE THIS PAGE

facebook