with examples. This tutorial is mainly for the beginners but experienced
the syntax of the language like statements, conditionals, loops, functions, etc.
values, work with image rollovers and create other user interface.
is widely used scripting language for mainly validating the user input on the
client side (browser). It is also used with the DHTML for creating interactive
user interface design.
- What is
This section will introduce with the Java Scripting language. You will learn
in the Internet Explorer.
Variables and Data types
In this section you will learn how to use Variables and Data types in
- String and
- Conditions In Java Script
Java Script is Netscape's Cross - platform, Object -
based Scripting language for Client and Server applications. It is a Case sensitive
In this section you will learn example to use while, do-while and switch
- Functions in
- Classes and
After learning this lesson you will be able to use Classes and Object in
In this lesson you will learn how to Dynamically swap the images with
with Link and Images
- Using onMouseOver and onMouseOut
- Using onClick to process clicks on hyperlinks
- Conditionally navigating the user to a page when
they click a link
In this lesson you will learn how to navigate to some other URL when use
selects a link from the combo box.
- Popup windows
In this lesson you will learn form validation using regular expressions.
I this example we will show you how to validate email address in you JSP
- Java Script Code of Calendar and Date Picker or Popup Calendar
This is detailed java script code that can use for
Calendar or date picker or popup calendar. In the code given below there are
In this example we create a combo box of different technologies where if user
select any technology and press.
element to any previously existing element then we can use appendChild() to add the child element.
The add() method is used to add an option to a dropdown
list. Here in this example we have added an option to the select tag by using
the add() method.
The addImport() method adds style sheets to the
document by importing the style sheets collection.
the HTML content that already exists then we can use appendData() method
The user can apply some properties to the element of
the HTML document by using the method applyElement(), which is called on some object of element.
Some times you need that some of the html text blinks
on the browser again and again without using any kind of picture or image so to
One of the method defined in the string to show bold
string value in the html page can be used to bold the text on the document.
We can clear string from a selected string or text by the use of
selection object's clear() method.
used to stop or clear the time out variables value.
In the html page we can select the check box either by
clicking on the checkbox option while selecting any option or we can call the
As it is clear with its name that it clones the node.
returns the clone node object.
method createAttribute which can be used to create the html tag's attribute
dynamically by using the method createCaption().
If user wants to create and add any event to the
specified object then its possible to create and add event to the objects with
We can add header and footer also to the table by using
the specified table.
specified table by using the method createTHead() on the table object.
you have seen that we can add the caption to our table at execution time with
the use of createCaption() method and in similar manner we can delete the
caption of the table by calling the method deleteCaption().
In the HTML table if we want to delete the table footer
As we can create and delete Table footer in the html
instead of creating tables dynamically , adding and deleting table footers ,
showing alert message , client side validation and many more.
of the specified text range. In this example code we have called the duplicate
method on the text range object to create a duplicate copy of that text and then
it will be displayed through the alert() method.
presented element at the specified coordinate position given in the
We can perform the mathematical calculations in the
useful functions in which exp() is one important function generally used by the
the input text box , to the specific button or to any radio button and many more
We can also give different colors to the fonts by using the method
over any string instead of using the <font></font> tags. The
attribute in an object. Most of the times it is used with the
be used to retrieve the attribute node reference.
from the clipboard either via dataTransfer object or via the clipboardData
We can access the specific element of any existing html page by using the
method getElementById(). For accessing any element in order to refer to
it must have its some unique identity.
In this section you will see that how we can insert new node or element
before the referenced node as a child node of the current node and in it the
current node will be act as the parent node.
table object's row element.
specific string value to the position which is specified by the user.
of the string object. It has only one difference that it searches for the very
last occurrence of searching pattern and indexOf() method goes for the very
first occurrence of searching pattern.
use the link method it creates hyperlink programmatically.
If we have to compare some values then we can use the if-else statement but
it will make our code more complex. Therefore instead of using the if-else
statement we can use the max method of the Math object.
As we can use the Math.max() method to find the maximum of zero or
more values in the same way we can use Math.min() method to find the
minimum of zero or more values.
the named items from the collection of elements. It takes the named item by the name
or its id.
to the various locations.
This method scrollIntoView() is supported by both Internet Explorer
and Firefox and can be a very useful method while applying scrolling
property to HTML page, div or frame.
provided number of pixels. One most important thing here to notice is that it
can scroll windows only if the scrolling property is visible.
We can resize window by using the method resizeBy(). It resizes the
window into the specified pixels passed as parameters to this method.
HTML page into which we have created a form with the id "userform".
Into this form we have taken two input fields "Name" and "Age".
Some times programmer may needs to remove some node according to their
element. Most of the times it is used with the document.getElementById()
Some times programmers may need to evaluate the value by the power of some
element of the specified element. By using the parentElement() method.
Here is a case when
this might be very useful. Suppose you are filling some information on the form
and at that time you are required to perform some task on another page then
either you have to click on browser to create new window or you may loose all
information filled in that form.
specified URL location. After calling replace() method ,you cannot
go back to the previous URL using browser's "Back" button.
This function may be helpful when user wants to
show some elements on any event and then required to hide them when action has
inclusive and these numbers represent the day of the week according to the Universal
Coordinated Time (UTC).
returns an integer value between 1 and 31 that represents day
from the date object's month.
the Date object using the local time.
method here we have created a button in the HTML page.
to the removeAttribute() method. It is used to remove attributes when you
have a reference to the attribute object.
of a date object.
setUTCFullYear() method sets the full year for the provided date
according to the Universal Coordinated Time (UTC).
it sets an integer value between 1 and 31 provided by the user that represents day of the date object's month.
date object with an integer value between 1 and 31 that represents day of the
attribute node to the specified element.
format. It makes a copy of that string and then embed it within
<sup></sup> tags as in HTML.
second way of form submission i.e. submitting form programmatically using the
format. It creates a copy of string and then embed it within
<sub></sub> tags as in HTML.
converts the string in the format like "
returns value between -1 to 1.
dialog box which is a simple html page but when a modal dialog opens, user can't switch to another page until it closes the modal dialog box.
the number with the number of digits as provided for the precision.
In this section, we are going to create the namespace using the
anchor() method creates an HTML anchor with a NAME attribute on the specified text.
method can be used in Internet Explorer to add
a web address or a redirected page to the Internet
method returns the arc tangent of a specified number as a numeric value between
-PI/2 and PI/2 radians.
method allows you to display the specified string in a big font.
charCodeAt() method returns the Unicode of the character at a specified
cos() returns the cosine of the specified number. It returns the numeric value
between -1 and 1.
the given example, we are going to search a particular text from the specified
This method creates an instance of the element for the specified tag.
It works only on Internet Explorer.
The deleteRow() method removes the row at the specified position from
passed into the method and executes it.
The fromCharCode() method returns a readable string from the
specified sequence of Unicode character values.
setFullYear() method is used to set the full year for the specified date according to
local time. In the given example, we have created a date object and specify date
and time to it.
This section illustrates you how to add a new row to the existing table