2013-09-25

JavaScript - DOM Document Object Model, Error Handling, Objects


DOM Document Object Model

DOM window

DOM Navigator

DOM screen

DOM History

DOM document

Error Handling

Try -- Catch

Throw

Objects

Properties

Methods

Functions also behaves like objects?

Arrays also behave like objects?

Form Object

String Objects

Math Objects

Date Object

Regular Expressions

DOM (Document Object Model)

 

DOM window

 

Window is the top most level object in the JavaScript hierarchy as we saw in DOM topic, window object represents a browser window. Every <body> tag creates an window object. As we know that an object can have properties and methods or functions. Window object have man properties and methods listed below to know about any property click on that property.

 

Properties:

 

document
History
Location
Name
closed
toolbar
scrollbars

 

Methods

 

Open()
print()
alert()
confirm()
close()
moveTo()
prompt()

 

 

Properties

Name

 

This window property is used to set or get the name of the window in use. When we are working with many windows it becomes very necessary to know the name of the window we are working with. The below given example shows how to get the name of the window in use.

 

Example:

 

<html>

<head>

<script>

function nm()

{

document.write("<br> Current Window Name is : "+win.name)

}

</script>

</head>

<body><script>

win=window.open('','Sandeep','width=150,height=150')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script><input type="button" value="Hit me to know name of window" onclick="nm()"></body>

</html>

 

 

Closed

 

This window property is used to know whether the specified window is closed or not many times a processing is to be done but before that it becomes necessary to check whether the page is open or not we can use this window property to know the status of the window. The below given example shows how to get the status of the window in use.

 

Example:

 

<html>

<head>

<script>

function nm()

{

if (win.closed)

{

document.write("<br> Sorry.. The window has been closed")

}

else

{

document.write("<br> The window is open enjoy.. it")

}

}

</script>

</head>

<body><script>

win=window.open('','Sandeep','width=150,height=150')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script><input type="button" value="Hit me to know name of window" onclick="nm()"></body>

</html>

 

 

Toolbar

 

This window property is used to add the toolbar to the window at the time of creation of window , Standard toolbar appears which can be used to move forward or back , go or refresh etc. properties of the toolbar could be accessed. The below given example shows how to set the toolbar to the window.

 

Example:

 

<html>

<head>

</head>

<body>

<script>

win=window.open('','Sandeep','width=450,height=350,toolbar')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script>

</body>

</html>

 

 

Scrollbars

 

This window property is used to add the scrollbars to the window at the time of creation of window , scrollbars are used to move up or down on the page having matter more than the window size. The below given example shows how to set the scrollbars to the window.

 

Example:

 

<html>

<head>

</head>

<body>

<script>

win=window.open('','Sandeep','width=450,height=350,toolbar,scrollbars')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script>

</body>

</html>

 

 

Methods

Open()

 

This window method is used to open the specified window. Using this method we can open any window from code as and when required. The below given example shows how to open a window using JavaScript code.

 

Example:

 

<html>

<head>

</head>

<body>

<script>

var i=0

var winname="sandeep"

for(i=0;i<5;i++)

{

winname=winname+i

win=window.open('',''+winname,'width=450,height=350,toolbar,scrollbars')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

}

</script>

</body>

</html>

 

 

print()

 

This window method is used to print the specified window contents on printer. We can activate the printer control panel using this method and set desired print settings. The below given example shows how to print a widow contents.

 

Example:

 

<html>

<head>

<script>

function ff()

{

window.print()

}

</script>

</head>

<body>

<input type=button name=b1 value= "hit me to print the page " onclick="ff()">

<script>

win=window.open('','MKDT','width=450,height=350,toolbar')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script>

</body>

</html>

 

 

Alert Box

 

Alert box is a dialog box which displays a message in a small window with an OK button, user have to click on the ok button to proceed.

 

Example:

 

<html>

<head>

</head>

<body>

<script type="text/JavaScript">

alert("Hit me to proceed")

document.write(" Have a nice day ");

</script >

</body>

</html>

 

Understanding the program:

user can type his desired message with the alert box in the quotes like alert("what ever text user want "). This message will be displayed with the alert window to guide the user.

 

output is:

Have a nice day

 

 

Confirm Box

 

Confirm box is a dialog box which displays a message in a small window with two buttons. One Ok and other Cancel. This method can be used to get the response of user in positive by clicking on ok and in negative by clicking on cancel. The value returned by the confirm method in case of OK is true and in case of Cancel is false. A programmer can program the code for positive and negative situations depending on the response returned by the user.

 

Example:

 

<html>

<head>

</head>

<body>

<script type="text/JavaScript">

a=confirm(" Want to Proceed ? ");

document.write("Your have clicked on : "+a);

</script >

</body>

</html>

 

understanding the program:

If user will clicks on Ok then you have clicked on true will appear
If user will clicks on Cancel then you have clicked on false will appear

 

 

Close

 

This window method is used to close the specified window. Using this method we can closed any window from code as and when required. The below given example shows how to close a window after clicking on a button.

 

Example:

 

<html>

<head>

<script>

function ff()

{

win.close()

}

</script>

</head>

<body>

<input type=button name=b1 value= "hit me to Close the window " onclick="ff()">

<script>

win=window.open('','Sandeep','width=450,height=350,toolbar')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

</script>

</body>

</html>

 

 

moveTo()

 

This window method is used to move the specified window to desired location on screen. The two parameter s are passed with this function one for x coordinate and other for y coordinate. Using this method we can position window to our desired position using code. The below given example shows how to position a window using JavaScript code.

 

Example:

 

<html>

<head>

</head>

<body>

<script>

var i=0

var winname="sandeep"

for(i=0;i<5;i++)

{

winname=winname+i

win=window.open('',''+winname,'width=450,height=350,toolbar,scrollbars')

win.document.write("This is a new window created by sandeep , it's name is sandeep, move the window & click on the button ")

}

</script>

</body>

</html>

 

 

Prompt Box

 

Prompt box is a dialog box which displays a message in a small window with a text box along with two buttons . One OK and other Cancel. Prompt method has ability to return the text kept with the prompt method's text box , this value can be assigned to some variable and can be used as and when require.

 

Example:

 

<html>

<head>

</head>

<body>

<script type="text/JavaScript">

prompt ("Enter your name", "")

</script >

</body>

</html>

 

understanding the program :

A dialog box with a text box and two buttons will appear, the message typed with prompt method will be displayed on the dialog box the text box will appear blank , if any text is typed at the place of blank (" "), that text will appear in the text box on dialog box.

 

 

Example

 

<html>

<head>

</head>

<body>

<script type="text/javascript">

prompt ("Enter your name", " enter your name here")

</script >

</body>

</html>

 

understanding the program :

A dialog box with a text box and two buttons will appear, the message typed with prompt method will be displayed on the dialog box the text box will appear filled with " enter your name here " text.

 

Storing value accepted from a prompt box in variables :

 

<html>

<head>

</head>

<body>

<script type="text/javascript">

var name,address

name=prompt ("Enter your name", " enter your name here")

address = prompt ("Enter your address", "Address Please ")

document.write("Your Name : "+name);

document.write("<br>Your Address : "+address);

</script >

</body>

</html>

 

understanding program :

As we know that prompt method has the ability to return the text stored in it's text box, so the name fed by the user will be stored in the name variable and address of user in address variable, which will be displayed on the screen by document.write method.

 

Output is :

Your Name : Rhythm
Your Address : A -45, Preet Vihar, Delhi - 110092

 

 

 

 

DOM Navigator

 

Navigator contains information about the client's browser. A user surfs the internet using a browser program like internet explorer or Netscape navigator. These programs are quite smart programs. Javascript Navigator object contains information about user's browser program. The properties and methods of navigator object are listed below.

 

Properties:

appName
onLine
platform
appCodeName
appVersion

 

Methods

JavaEnabled()

 

 

Properties

appName()

 

This navigator property returns the current browser's name. Different users use different browser program many times it becomes very necessary to know the browser name of the user because it is possible that some particular command do not work on some specific browser. To know the name of the browser we can use this method.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My current browser is : "+navigator.appName)

</script>

</body>

</html>

 

 

onLine ()

 

This navigator property returns true if the computer is in offline mode else false. If our computer is online this method returns false else it returns true.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My current browser is : "+navigator.onLine)

</script>

</body>

</html>

 

 

platform ()

 

This navigator property returns the operating system platform. Any operating system follows a platform (some basic rules set) , like whether it is 16 bit program or 32 bit program. This method provides facility to know the operating system platform so that with this knowledge the user can put desired condition in his program.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My current operating system platform is : - "+navigator.platform)

</script>

</body>

</html>

 

 

appCodeName ()

 

This navigator property returns browser's code name. Every browser performs certain code. To know the code name of that browser we can use this method.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My current operating system platform is : - "+navigator.appCodeName)

</script>

</body>

</html>

 

 

appVersion ()

 

This navigator property returns browser's platform and version (version is the advancement level). This property is used to know that what platform the user is using what is the version (advancement level) of user's platform.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My Browser's Details : - "+navigator.appVersion)

</script>

</body>

</html>

 

 

Method

JavaEnabled()

 

This navigator property returns true if the browser is java enabled else false. Java is a very powerful language, our web page may require connectivity to a Java program but in that case the browser should be java enabled. If the browser will not be java enabled then the functionalities programmed in java will not work properly. To know whether the browser is java enabled or not we can use this method.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br>My Browser is Java Enabled ? : - "+navigator.javaEnabled())

</script>

</body>

</html>

 

 

 

DOM screen

 

Screen object contains information about the client's screen . Different users can have different screen sizes and types. In case we want to create something we should keep in mind the screen dimensions will not be same and because the screen sizes will not be same so other properties will also require attention. The properties of screen object are listed below.

 

Properties:

 

height
width
availHeight
availWidth

 

height

 

This screen property returns the screen height .

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br> the work area height is "+screen.height + " px.")

</script>

</body>

</html>

 

 

Width

 

This screen property returns the screen width . Different screens can have different dimensions , width property returns the height of the screen in use. A programmer can program suitably after knowing the height of screen in use.

 

Example

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br> the screen width is "+screen.width + " px.")

</script>

</body>

</html>

 

 

availheight

 

This screen property returns the screen height (screen height- taskbar). A web page is displayed on the screen availheight property returns the screen height which can be calculated by total screen height - height of taskbar.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br> the work area height is

"+screen.availheight + " px.")

</script>

</body>

</html>

 

 

availwidth

 

This screen property returns the screen width (screen width- taskbar). Different screens can have different dimensions , availwidth property returns the screen web page available width of the screen in use. A programmer can program suitably after knowing the height of screen in use.

 

Example:

 

<html>

<head>

</head>

<body bgcolor=red text=yellow>

<script type="text/javascript">

document.write("<br> the work area height is "+screen.availheight + " px.")

</script>

</body>

</html>

 

 

 

DOM History

 

History object contains information about the URLs user has accessed or visited using browser window. When a user access a web page the details of that web page are stored on computer by browser in form of history. We can access these details using the history object .The properties and methods of history object are listed below.

 

Properties:

Length

 

Methods

Back()
Forward()
Go()

 

 

Properties

length

 

length property of history object returns total number of elements in history list. The number of objects in the history list may be different at different times because generally person do not visit same number of pages. Length property returns us the total number of pages available in history collection.

 

Example:

 

<html>

<head>

</head>

<body>

<blockquote> history length will tell you that how many

elements are in history list </blockquote>

<script type="text/javascript">

document.write(history.length)

</script>

</body>

</html>

 

 

Method

Back()

 

This history object's method loads the previous URL in the history list. The page we just left after moving to new page is history for current page. We can access the previous page by using back() method. This method will drop us back to the previous page.

 

Example:

 

<html>

<head>

</head>

<body>

<blockquote>If any page is opened in the browser before

 

this page the it will call that page back </blockquote>

<script type="text/javascript">

function ff()

{

history.back()

}

</script>

<input type ="button" value="hit me to go back " name="b1"

onclick="ff()">

</body>

</html>

 

 

Forward()

 

This history object's method loads the next URL in the history list. There is a list page name in history. To go to the page next to current page or url can be accessed by forward () method. It will drop us on the next page to current page.

 

Example:

 

<html>

<head>

</head>

<body>

<blockquote>If any page is opened in the browser before

 

this page the it will call next page</blockquote>

<script type="text/javascript">

function ff()

{

history.forward()

}

</script>

<input type ="button" value="hit me to go forward "

 

name="b1" onclick="ff()">

</body>

</html>

 

 

go()

 

This history object's method loads the specified web page number in the history list. To load any page in history we can use go () method. This method calls the specified web page and loads it on browser.

 

Example:

 

<head>

</head>

<body>

<blockquote>It will call the specified page number inthe

history list</blockquote>

<script type="text/javascript">

function ff()

{

history.go(-2)

}

</script>

<input type ="button" value="hit me to go forward "

name="b1" onclick="ff()">

</body>

</html>

 

 

 

DOM document

 

window is the top most level object in the JavaScript hierarchy as we saw in DOM topic, document object is child object of window object. Object model also contains collections. A collection is an array holding one or more objects. The collection in document object is 'all' which represent all the elements in the document. A document object can be used to access all the elements on a page using all collection. The collections, properties, objects are listed below.

 

Collections:

anchors[]
forms[]
images[]

 

Properties:

cookie
title
URL
lastmodified

 

Methods

getElementById()
getElementbyTagName()
write()

 

 

Collection

Anchors

Anchor collection returns details about anchors available on your web page. Anchors are links created in a document to get connected with other documents. Using these links we can call other specified document on the browser.

 

Example:

 

<html>

<head>

</head>

<body>

<a name="one"> this is anchor no. 1 </a> <br>

<a name="two"> this is anchor no. 2 </a> <br>

<a name="three"> this is anchor no. 3 </a> <br>

<a name="four"> this is anchor no 4 </a> <br>

Total no of anchors in this page are :

<script>

document.write(document.anchors.length);

</script>

</body>

</html>

 

Output is:

this is anchor no. 1
this is anchor no. 2
this is anchor no. 3
this is anchor no 4

 

Total no of anchors in this page are : 4

 

 

Example:

 

<html>

<head>

<title>anchors </title>

</head>

<body>

<a name="one"> this is anchor no. 1 </a> <br>

<a name="two"> this is anchor no. 2 </a> <br>

<a name="three"> this is anchor no. 3 </a> <br>

<a name="four"> this is anchor no 4 </a> <br>

the name of anchor no 2 is:

<script>

document.write(document.anchors[1].name);

</script>

</body>

</html>

 

Output is:

 

this is anchor no. 1
this is anchor no. 2
this is anchor no. 3
this is anchor no 4

the name of anchor 2 is : two

 

Example:

 

<html>

<head>

<title>anchors </title>

</head>

<body>

<a name="one"> this is anchor no. 1 </a> <br>

<a name="two"> this is anchor no. 2 </a> <br>

<a name="three"> I am anchor no. 3 India is great </a> <br>

<a name="four"> this is anchor no 4 </a> <br>

The Text inside anchor no. 3 is :

<script>

document.write("<br>"+document.anchors[2].innerHTML);

</script>

</body>

</html>

 

output is:

this is anchor no. 1
this is anchor no. 2
I am anchor no. 3 India is great
this is anchor no 4
The Text inside anchor no. 3 is :
I am anchor no. 3 India is great

 

 

forms

 

forms collection returns details about form objects available on your web page. All the elements contained by a form can be accessed by form object.

 

Example:

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<form name="f1">

name <input type=text name=t1>

</form>

<form name="f2">

name <input type=text name=tt1>

</form>

<form name="f3">

name <input type=text name=ttt1>

</form>  

Name of First form is

<script>

document.write(document.forms[0].name);

</script>

</body>

</html>

 

Output is:

name

 

name

 

name

 

Name of First form is f1

 

Example

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<form name="f1">

name <input type=text name=t1>

</form>

<form name="f2">

name <input type=text name=tt1>

</form> <form name="f3">

name <input type=text name=ttt1>

</form>  

Total no of forms on page are :

<script>

document.write(document.forms.length);

</script>

</body>

</html>

 

Example:

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<form name="f1">

name <input type=text name=t1>

</form>

<form name="f2">

name <input type=text name=tt1 value="hi user">

</form>

<form name="f3">

name <input type=text name=ttt1>

</form>  

Total no of forms on page are :

<script>

document.write(document.forms[1].tt1.value);

document.write("<br>Total no of elements of form 3 are " +document.forms[2].elements.length);

</script>

</body>

</html>

 

Output is:

name

 

name

 

name

 

Total no of forms on page are : hi user

 

Total no of elements of form 3 are 1

 

 

images

 

forms collection returns details about images available on your web page. A web page contains images which forms an array or collection. This collection can return each and every detail about any image present on the web page using different image properties.

 

Example:

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<img name="delhi" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="dehradune" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="srinagar" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="patna" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5> <br><br>

Name of firs image on page is :

<script>

document.write(document.images[0].name);

</script>

</body>

</html>

 

Output is:

Name of first image on page is : delhi

 

Example:

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<img name="delhi" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="dehradune" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="srinagar" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="patna" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5> <br><br>

Total no of images on page are :

<script>

document.write(document.images.length);

</script>

</body>

</html>

 

Output is:

Total no of images on page are : 4

 

Example:

 

<html>

<head>

<title>forms </title>

</head>

<body bgcolor=red text="yellow">

<img name="delhi" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="dehradune" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="srinagar" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5>

<img name="patna" src="dom.gif" width=100 height=100 hscpace=5 vspace=5 border=5> <br><br>

width and height of third image on page :

<script>

document.write("<br> Height "+document.images[2].height);

document.write("<br> Width "+document.images[2].width);

</script>

</body>

</html>

 

output is:

width and height of third image on page :

 

Height 100

Width 100

 

 

Properties

Cookie

 

Cookies property returns or sets the cookies associated with current document. Cookies are the text which helps the server to identify a computer. Server responses the request of a client.

 

Example:

 

<html>

<head>

</head>

<body>

<h1 align=center> ... Cookies with this page ... </h1>

<script type="text/javascript">

a="Vishwajit Vatsa "

document.cookie=a

document.write(document.cookie)

</script >

</body>

</html>

 

output is:

... Cookies with this page ...

name=Vishwajit Vatsa

 

 

title

 

This property returns the title of the web page. A web page can have a title created using title tag. We can know the title of any web page using title property of document object.

 

Example:

 

<html>

<head>

<title> This is just trial </title>

</head> <body>

<h3 align=center> ...Title of this page ... </h3>

<script type="text/javascript">  

document.write(document.title)

document.write("<br>Total characters in Title are   "+document.title.length) a=prompt("Enter new Title","")

document.title=a document.write("<br> New Title is "+document.title)

</script >

</body>

</html>

 

output is:

...Title of this page ...

This is just trial
Total characters in Title are 18
New Title is sarla

 

 

URL

 

This property returns the URL of the current document. URL stands for uniform resource location. This could be the location on a local machine or on remote machine. Where ever a document is stored is called it's URL. URL returns the address of the document.

 

Example:

 

<html>

<head>

<title> This is just trial </title>

</head>

<body>

<h3 align=center> ...URL of this page ... </h3>

<script type="text/javascript">  

document.write(document.URL)

document.write("<br>Total characters in URL are "+document.URL.length) a=prompt("Enter new URL or address of any html file ","")

document.URL=a document.write("<br> New URL is "+document.URL)

</script >

</body>

</html>

 

 

lastModified

 

lastModified property returns date & time of a document last modified. The access and modification of every javascript file is maintained by lastModified property. We can know the date and time of any file got modified.

 

Example:

 

<html>

<head>

</head>

<body>

<h3 align=center> ... The last modification with this page   was made on ... </h3>

<script type="text/javascript">

document.write(document.lastModified)

</script >

</body>

</html>

 

output is:

... The last modification with this page was made on ...

01/01/2000 00:17:40

 

 

Method

getElementById()

 

getElementById() method returns a reference to the first object with specified id. An object can have an id with it for it's recognition we can access that element using getElementById() function.

 

Example:

 

<html>

<head>

</head>

<body>

<h4 id="obj3" > We teach our children how to walk and we also teach them that we can not fly </h4>

<script type="text/javascript">

var a=document.getElementById("obj3")

document.write("<br>"+a.innerHTML)

</body>

</html>

 

output is:

We teach our children how to walk and we also teach them that we can not fly.

 

 

getElementbyTagName()

 

getElementbyTagName method returns a collection of objects with specified tag name. All the objects can have user defined name. We can access that element using the getElementbyTagName() function.

 

Example:

 

<html>

<head>

</head>

<body>

<a > this is very cold </a><br>

<a > It is true the true never dies </a> <br>

<h5> it is heading 5 </h5>

<h5>it is heading 5 </h5>

<script type="text/javascript">

var a=document.getElementsByTagName("h5")

document.write(" h5 tag is used "+a.length+" Times")

document.write("<br> text in first h5 is :- "+a[0].innerHTML);

</script>

</body>

</html>

 

output is:

this is very cold
It is true the true never dies

 

it is heading 5

it is heading 5

 

var a=document.getElementsByTagName("h5") document.write(" h5 tag is used "+a.length+" Times") document.write("
text in first h5 is "+a[0].innerHTML); h5 tag is used 2 Times
text in first h5 is it is heading 5 h5 tag is used 2 Times
text in first h5 is it is heading 5

 

 

write

 

write method displays the text and/or HTML expressions typed in the brackets on the web page. Write method displays the text and the variable values on the monitor. In javascript a HTML code can also be used inside a write method brackets.

 

Example:

 

<html>

<head>

</head>

<body>

<script type="text/javascript">

var a,b,c document.write("This is a simple text, we used write method  

to print this line ");

document.write("<br>here is a HTML expression

<body   bgcolor=red text=yellow> ")

</script >  

</body>

</html>

 

output is:

This is a simple text, we used write method to print this line

here is a HTML expression

 

 

 

Error Handling

 

Try -- Catch

 

It is very difficult to analyze all the situations to arise during runtime of a program because of which some conditions may remain unanswered, these unanswered conditions are called exceptions, JavaScript provides a facility to handle such situations. We can use try and catch statements to handle such situations. The whole code is kept inside the try block an in case any exception arises it is thrown using throw statement which is caught by the catch statement.

 

Example:

 

<html>

<head>

<title>events </title>

</head>

<body bgcolor=blue text="white" >

<h4> Enter Either Value as Zero (0)</h4>

Value 1: <input type="text" id="t1"> <br>

Value 2: <input type="text" id="t2"> <br>

Answer: <input type="button" id="b1" value="Hit me " onclick="pp()"> <br>

<script>

function pp()

{

var c= parseInt(document.all.t1.value)

var d=parseInt(document.all.t2.value)

var e=0

try

{

if(d==0)

{

throw "Divisor is Zero"

}

if (c==0)

{

throw "To be divided is Zero"

}

}

catch(error) {

alert(error)

}

}

</script>

</body>

 

 

 

Throw

 

It is very difficult to analyze all the situations to arise during runtime of a program because of which some conditions may remain unanswered, these unanswered conditions are called exceptions, JavaScript provides a facility to handle such situations. We can use try and catch statements to handle such situations. The whole code is kept inside the try block an in case any exception arises it is thrown using throw statement which is caught by the catch statement.

 

Example

 

<html>

<head>

<title>events </title>

</head>

<body bgcolor=blue text="white" >

<h4> Enter Week Day Please</h4>

Value 1: <input type="text" id="t1" > <br>

Value 1: <input type="button" id="b1" value="Hit me " onclick="pp()"> <br>

<script>

function pp()

{

var c= parseInt(document.all.t1.value)

 

try

{

switch(c)

{

case 1 :

throw "Sunday"

break

case 2:

throw "Monday"

break

case 3:

throw "Tuesday"

break

case 4:

throw "Wednesday"

break

case 5:

throw "Thrusday"

break

case 6:

throw "Friday"

break

case 7:

throw "Saturday"

break

default:

throw "The real error"

}

}

catch(error) {

alert(error)

}

}

</script>

</body>

</html>

 

 

 

Objects

 

Properties

 

Properties are variables having values desired for an object and these variables determines the behaviour of that object. The variable can have different types of data .The type of data determines the type of variable. What an object contains is actually it's properties or variable used for it. The properties of an object can be changed by using a method.

 

Example

 

<html>

<head>

</head>

<body>

<script>

var car = new Object

car.name="Ferari"

car.color="red"

car.no="DEL1504"

document.write("<br> Car Name :"+car.name)

document.write("<br> Car Color :"+car.color)

document.write("<br> Car Number :"+car.no)

</script>

</body>

</html>

 

Output is:

Car Name :Ferari
Car Color :red
Car Number :DEL1504

 

 

 

Methods

 

Methods are set of actions that allow the access to the variables of an object. A Method contains the code to perform some task for an/many object(s). The methods and the variables forms an object.

 

Example

 

<html>

<head><title> Functions are like Objects </title>

</head>

<body>

<script>

function car()

{

var car = new Object

car.name="Lancer"

car.color="Blue"

car.no="MAH2059"

document.write("<br> Car Name :"+car.name)

document.write("<br> Car Color :"+car.color)

document.write("<br> Car Number :"+car.no)

}

var mycar= car <

Show more