Date object

We can display current date and time using JavaScript alert window by linking it to a button click event. We can place this button any where inside a page and display time and date once it is clicked by user. This is a simple script and we will try to develop better applications by learning such small examples.

We will be using built in Date object. We can create instances of this object and use in our script like this
var  my_time = new Date()

to display current date and time in alert window

Now this instance we can display by using JavaScript alert window.
To display the value we can use simple output command like this
var dt= new Date();
The output will be like this Sat Jan 28 2012 10:17:04 GMT+0530 (India Standard Time)

Creating Date object

This is the format to be used
new Date(year, month, day, hours, minutes, seconds, milliseconds);
Example :
var dt= new Date('2014','03','14','10','34','45','1000')

Using button Click

Now this alert we will trigger when a button is clicked by a user. Here is onclick event of a button click.
<input type=button value="Show Time" onclick="show_now();">
Here is the demo, click this button

Here is the complete code for the page with Show Time button.
<title>(Type a title for your page here)</title>
<script type="text/javascript"> 
function show_now() { 
var my_time = new Date();
</head> <body> <input type=button value="Show Time" onclick="show_now();"> <div id=display></div> </body>

Showing DD/MM/YYYY format

Today's Date
<input type=button value='Show Date' onclick="show_date();">
<div id=display2></div>
<script type="text/javascript"> 
function show_date() { 
var in_date = new Date();
var str=in_date.getDate() +'/'+(in_date.getMonth()+1)+'/'+in_date.getFullYear()
Displaying date and time.

Full code to show updating date and time is here.

Draw Analog Clock on HTML Canvas using Jquery or JavaScript.

Analog Clock using HTML Canvas


Date Reference Getting time from Date object
Subscribe to our YouTube Channel here


* indicates required
Subscribe to plus2net


    hi, how do I move the button to the middle of the page?


    Align Div

    Post your comments , suggestion , error , requirements etc here

    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 All rights reserved worldwide Privacy Policy Disclaimer