javascript texte1 lesson1
how javascript works
introduction
events, functions, objects, window, document, image, dot, methods, properties
events
onMouveOver event
initiates image rollover or popup menu
events are added to html tags
and point to a function
when the event occurs, the function is called and run = a function call
to do things at the right time
function:
a function contains javascript statements that manipulate an object
object:
an object is something on your web page or built into the browser
window:
the browser window is referred to as "window"
document
the page loaded in the window is the document or window.document
image
an image on your page named with th name attribute to ,say, name="pooky" would be refferred to as
"window.document.image.pooky"
dots
the dots separate the parent object from the child object
javascript object reference
Using this list of objects and child objects to point to a specific object using names and dots (.) is called a JavaScript Object Reference.
methods and properties
we can use JavaScript Methods and Properties to manipulate that object
method
A method is something an object can do or call on
property
A property is a characteristic of an object that can be dynamically changed by JavaScript.
example
background color
beginning
<html>
<head>
<title>JS Background Changing</title>
<script language="JavaScript">
YOUR FUNCTIONS AND STUFF WILL GO HERE.
</script>
</head>
<body bgcolor="white">
<p>Here's some regular ol' paragraph content.</p>
<a href="#" onMouseOver="change_color()">Hover Here To
Change Background Color</a>
</body>
</html>
next
<html>
<head>
<title>JS Background Changing</title>
<script language="JavaScript">
function change_color(){YOUR
JAVASCRIPT STATEMENTS WILL GO BETWEEN THESE CURLY BRACKETS}
</script>
</head>
<body bgcolor="white">
<p>Here's some regular ol' paragraph content.</p>
<a href="#" onMouseOver="change_color()">Hover Here To
Change Background Color</a>
</body>
</html>
next
<html>
<head>
<title>JS Background Changing</title>
<script language="JavaScript">
function change_color(){document.bgColor="red"}
</script>
</head>
<body bgcolor="white">
<p>Here's some regular ol' paragraph content.</p>
<a href="#" onMouseOver="change_color()">Hover Here To
Change Background Color</a>
</body>
</html
next add a new function
<script language="JavaScript">
function change_color(){
document.bgColor="red";
document.fgColor="green"}
</script
next add a second function
<a href="#" onMouseOver="change_color()" onMouseOut="change_back()">Hover Here To Change Background Color</a>
next
<script language="JavaScript">
function change_color(){
document.bgColor="red";
document.fgColor="green"}
function change_back(){
document.bgColor="white";
document.fgColor="black"}
</script>
next
voici le lien à la page de la leçon http://www.scriptsearch.com/cgi-bin/jump.cgi?ID=3878