Pin Me

Basic JavaScript Lessons

written by: •edited by: Michele McDonough•updated: 4/2/2010

In this tutorial, I will show you why JavaScript is important in web development and take you through the basics of how it works. This lesson also explains basic printing and arithmetic operations.

  • slide 1 of 1

    JavaScript - Introduction

    This lesson will guide you through the basics of JavaScript - the scripting language of the web. JavaScript is a scripting language which can be used to add interactivity to static HTML web pages. It is mainly used as a client side script language in conjunction with CSS in order to create dynamic web user interfaces. It is supported by all major browsers including Internet Explorer, Firefox, Opera, Safari, Webkit etc.

    It is a very easy-to-learn language; the basics of which can be learned in a matter of minutes.

    • To insert JavaScript in an HTML web page, you must use the <script> tag.

    Example:

    <html><body><script type="text/javascript">All your JavaScript code goes here. </script>

    </body>

    </html>

    • To print something on the page using JavaScript, you can use the document.write() function.

    Here's an example:

    document.write("We are learning JavaScript");

    Whenever the browser loads the page, it recognizes the <script type="text/javascript"> tag and parses the following text as JavaScript code until it encounters the </script> tag.

    • You can also specify variables in Javascript using the var specifier. JavaScript variables are like variable in algebra; they can be used to store data.

    Example:

    var a = 10; / saving integer values in the variable

    var b = 20;

    var atext="Pat was here"; / saving a string in a variable

    To print variables directly,

    document.write(a);document.write(atext);

    • JavaScript also supports basic arithmetic operations like Add (+), Subtract (-), Multiply (*), and Divide (/).

    Here is how you can use them:

    var a = 10;var b = 20;

    var add = a+b; / Adding variables a and b

    var sub = a-b; / Subtracting variable b from a

    var mul = a*b; / Multiplying variables a and b

    var div = a/b; / Dividing variable a by b

    Here is some code to demonstrate what we have learned so far:

    <html>

    <body>

    <script type="text/javascript">

    var text = "JavaScript basic variable operations by Pat @ Brighthub";

    document.write(text + " <br> ");

    var a = 10;

    var b = 20;

    var add = a+b;

    var sub = a-b;

    var mul = a*b;

    var div = a/b;

    document.write("a= "+ a +" b = "+ b + " <br> ");

    document.write("a + b = "+ add + " <br> ");

    document.write("a - b = "+ sub + " <br> ");

    document.write("a * b = "+ mul + " <br> ");

    document.write("a + b = "+ div + " <br> ");

    </script>

    </body>

    </html>

    To run this, copy this code to a text file and rename it to webpage.html. You can name it anything you want. To view the page, open you web browser. Go to File > Open and browse to the location of the web page and open it.

    Note: Despite the similarities in name, JavaScript is completely different from Java.