With Javascript, it is possible to execute some code NOT immediately after a function is called , but after a specified time interval. This is called timing events.
It's very easy to time events in JavaScript. The two key methods that are used are:
SetTimeout( ) - executes a code some time in the future
clearTimeout( ) - cancel' s thesetTimeout( )
Note: the seTimeout( ) and clearTimeout( ) are both methods of the HTML DOM Window object.
Tutorial
When the button is clicked in the example below, an alert box will be displayed after 5 seconds
<html>
<head>
<script type= "text/javascript">
function timedMsg ( )
{
var t= setTimeout ("alert ( '5 seconds!') ", 5000)
}
</script>
</head>
<body>
<form>
<input type="button" value="Display timed alertbox!" onClick="timedMsg( )">
</form>
</body>
</html>
Labels
- CONTACT US (1)
- DHTML (19)
- HTML (30)
- JAVASCRIPT (39)
- WEB HOSTING (1)
- XML (25)
Donate Us
Labels
<html>
<head>
<script type="text/javascript">
function startTime( )
{
var today=new Date( )
var h=today.gethours( )
var m=today.getMinutes( )
var s= today.getSeconds( )
// add a zero in front of numbers < 10
m = checkTime(m)
s= checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime( )',500)
]
function checktime( i)
{
if (i<10)
{i="0" + i}
return i
}
</script>
</head>
<body onLoad="startTime( )">
<div id="txt"></div>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function mouseOver ( )
{
document.b1.src ="b_blue.gif"
}
function mouseOut ( )
{
document.b1.src ="b_pink.gif"
}
</script>
</head>
<body>
<a href="http://www.makemyhost.com" target="blank" onmouseover= "mouseOver( )" onmouseout= mouseOut ( )">
< img border ="0" alt="Visit" makemyhost.com!"
src="b_pink.gif" name="b1" />
</a>
</body>
</html>
Objects are useful to organise information
Properties
Thr syntax for accessing a property of an objects is :
objName.propName
You can add properties to an object by simply giving it a value. Assume that the personObj already exists - you can give it properties name firstname, lastname, age, and eyecolor as follows:
personObj.firstname="John"
personObj.lastname="Doe"
personObj.age=30
personObj.eyecolor="blue"
document.write(personObj.firstname)
The Code above will generate the following ouput:
John
Methods
An object can also contain methods:
You can call a method with the following syntax:
objName.methodName( )
Note: Parameters required for the method can be passed between the parentheses.
To call a method called sleep( ) or the personObj:
personObj.sleep ( )
Example
<html>
<body>
<script typ="text/javascript">
personObj.firstname="John"
personObj.lastname="Doe"
personObj.age=30
personObj.eyecolor="blue"
document.write(personObj.firstname + " is " + personObj.age + " years old.")
</script>
</body>
</html>
XML Namespaces
XML Namespaces provide a method to avoid element name conflicts.
Name Conflicts
Since elment names in XML are not predefined, a name conflict will occur when two different documents use the same element names.
This XML document carries information in a table:
<table>
<tr>
<td>Apples</td>
<td>Bananas</td>
</tr>
</table>
This XML document carries information about a table (a piece of furniture)
<table>
<name>African Coffee Table </name>
<width>80</width>
<length>120</length>
</table>
If these two XML documents were added together, there would be an element name conflict because both documents contain a <table> element with different content and definiton.
















