///Displaying Current Date with JavaScript and Basic Math Calculations

Displaying Current Date with JavaScript and Basic Math Calculations

Displaying Current Date with JavaScript and Basic Math Calculations

In HTML, there is no such thing as <date> </date>. We have to use either VBScript or JavaScript. Since here we are learning JavaScript, we’ll be taking the services of JavaScript to display the current date on our web page.

Consider the following script:

<script language="JavaScript">
HoldDate=new Date();
document.write(HoldDate.getDate() + "/" + (HoldDate.getMonth()+1) + "/" + HoldDate.getYear());
</script>

See it in the browser.

HoldDate = new Date() creates a new date-type variable, that holds all the information that a date should have, like day, month, year, and time. If you have walked through the lanes of Object Oriented Programming, you’ll understand that Date() is a class, and getDate(), getMonth() and getYear() are various methods encapsulated in this class. So the variable HoldDate practically inherits everything that is contained in Date().

Whereas, alert() wrote the output in a popup window, document.write() writes the entire thing on your web page, as a part of your HTML text, and that is where the true power begins to manifest itself.

Let’s quickly do some math now. We have all basic operators here that are used in numerical computations, for instance, +, -, * (multiplication) and / (division).

<script language="JavaScript">
num1=90;
num2=10;

document.write(num1 + " + " + num2 + " = " + (num1+num2));
document.write("<br>");
document.write(num1 + " – " + num2 + " = " + (num1-num2));
document.write("<br>");
document.write(num1 + " * " + num2 + " = " + (num1*num2));
document.write("<br>");
document.write(num1 + " / " + num2 + " = " + (num1/num2));

</script>

First see the outcome of this script on your page.

When it comes to using operators with variables, JavaScript is quite accommodating. Above, num1 and num2 we have defined as numeric variables, but [ num1 + " + " + num2 + " = " ] does not ADD num1 and num2, but instead, converts the concatenation into a string, while keeping [ num1 + num2 ] numeric. Remember we enclose actual strings with quotes, but not the variables. When a numeric variable is added to a string [ num1 + " + " ], the outcome is a string, but when a numeric variable is added to a numeric variable [ num1 + num2 ], the outcome is a number.

We can write complete HTML code within a JavaScript using document.write(). Above, if we hadn’t included document.write("<br>"), there would have been no line breaks in our outcome. To make this clearer, the script given below gives the output in bold letters:

<script language="JavaScript">

num1=90;
num2=10;

document.write("<b>");

document.write(num1 + " + " + num2 + " = " + (num1+num2));
document.write("<br>");
document.write(num1 + " – " + num2 + " = " + (num1-num2));
document.write("<br>");
document.write(num1 + " * " + num2 + " = " + (num1*num2));
document.write("<br>");
document.write(num1 + " / " + num2 + " = " + (num1/num2));

document.write("</b>");

</script>

There is a class called Math which has various methods to manipulate a number in a mathematical sort of way.

For instance,

<script language="JavaScript">

num1=22;
num2=9;
document.write(num1/num2);

</script>

gives the output as 2.4444444444444446, but if we use the script like this:

<script language="JavaScript">

num1=22;
num2=9;
document.write(Math.round(num1/num2));

</script>

gives the output as 2.

But, again, sometimes we need number that requires rounding off of say, two decimal places, or even one. There is a zany method of doing it:

<script language="JavaScript">

num1=22;
num2=9;
num=num1/num2;
document.write(Math.round(num*100)/100);

</script>

This gives us 2.44.

I guess here we should wrap up now. In the next article, we’ll learn how to use functions for repetitive tasks, and we’ll learn how to make sure that right values are entered in the form fields. Bye till then.

2010-05-26T10:58:38+00:00 June 1st, 2005|JavaScript|0 Comments

About the Author:

Amrit Hallan is a freelance web developer. You can checkout his website at http://www.bytesworth.com. For more such articles join BYTESWORTH REACHOUT at http://www.bytesworth.com/br/default.asp or if you have a web dev related question then post it at http://www.business180.com/index.php

Leave A Comment