dhtml, html, javascript, internet, style sheets, DHTML, HTML, Javascript, Style Sheets, Internet, De computer van Voltaire, thuisbasis, Thuisbasis Gelieve Netscape of Explorer 4.0 (of hoger) te gebruiken om deze pagina te bekijken.

INDEX
Manuals & Primers

ARTIKELEN

VARIA

VARIA & LINKEN

JAVASCRIPT TUTORIAL :

deel 5 (vervolg functies)

deel 6 (het HTML document)

deel 7 (elementen aanspreken)

deel 9 (het location object)

deel 10 (frames)

deel 11 (frames..vervolg)

deel 12 (frames..vervolg 2)

deel 13 (frames..vervolg 3)

deel 14 (frames..vervolg-4 en laatste deel)

deel 15 (het windows object)

deel 16 (Een venster een naam geven + sluiten)

deel 17 (Pagina's maken)

deel 18 (Timer, statusbar & Timeouts)

deel 19 (Objecten aanspreken, het DATE object)

deel 20 (Een algemene oefening)

Javascript om mee te nemen.

JAVASCRIPT

Door Ludo Cattoor, Webmaster.

Deel 2-Elementen in een HTML document

Gezien het hoofdobject het document is, en de tekeningen, de link, het formulier en de elementen objecten van dat hoofd-object zijn, zullen we ze op de volgende manier aanspreken :

document.images[0]
document.forms[0].elements[0]

Natuurlijk moeten we ook de eigenschappen van de objecten kunnen aanspreken. Bv. De tekst die in een teksbox wordt gezet. Dat is de waarde van de tekstbox of de VALUE van het object.
Waar kunnen wij deze eigenschappen vinden ?
Op het einde van de cursus geven we een overzicht. Daarin worden alle objecten en hun eigenschappen en methoden besproken.
Natuurlijk zullen tijdens de lessen en oefeningen verschillende eigenschappen en methoden reeds an bod komen.
Vb.

name=document.forms[0].elements[1].value;
Wat ook de waarde is van de tekst die we hier opvragen, deze zal opgeslagen worden in de variabele -name-

Hierbij een kleine uitleg.
We hebben gezien dat een variabele op de volgende manier wordt geschreven :

var x=12
we kunnen onmiddelijk de naam en het gelijkheidsteken zetten zonder het woord -var-.
Javascript weet onmiddelijk dat we een variabele bedoelen.
Dus :

x=12

De tekst die wordt opgeslagen in het element [0] van de forms[0] wordt weergegeven iedere keer dat we de variabele oproepen.
In het voorbeeld hierboven zouden we de tekst die in het tekstvak wordt gezet in een tweede venster kunnen oproepen enz...
En dan een laatste punt. Forms krijgt het nummer [0]. Maar in onze code hebben we eveneens een naam aan forms gegeven, t.t.z. myForm (zie hieronder<form name=myForm">)
En het eerste element, element[0] heeft ook een naam, t.t.z. op (zie hieronder we kunnen dus evengoed schrijven :

name=document.forms[0].elements[0].value;
of
name=document.myForm.op.value;

wat het natuurlijk een stuk gemakkelijker maakt. Want indien we twee of drie forms hebben, met elk een aantal elementen, zouden we al vlug aan document.forms[3].elements[8].value zitten wat het geheel nogal ingewikkeld maakt. Dus door aan alle forms en aan alle elementen namen te geven kunnen we ze gemakkelijker oproepen.

OPGEPAST. STEEDS DEZELFDE SCHRIJFWIJZE AANHOUDEN!!!

Nu gaan we de informatie (tekst) die we in het tekstveld van het formulier schrijven ook oproepen bij middel van een ALERT box.
Hiervoor gaan we de pagina gebruiken die we hierboven hebben gemaakt, n°100 We zullen eerst het script-deel laten zien, daarna de volledige HTML pagina.

<HTML>
<HEAD>
<TITLE> </TITLE>
<SCRIPT LANGUAGE="JAVASCRIPT">

function first()

{
name=document.myForm.op.value;

alert(name);

}
</SCRIPT>
</HEAD>
<BODY>

<FORM>
<INPUT TYPE=button VALUE=Opvragen onClick="first()">
</FORM>

</BODY>
</HTML>

Dit is het script-gedeelte. Nu moeten we dit in de HTML pagina invoegen, zodat we ons formulier krijgen, kunnen invullen, om vervolgens de inhoud van het element na Name : uit het formulier terug op te roepen.
Hieronder de volledige pagina:

<HTML>
<HEAD>
<TITLE> </TITLE>
<SCRIPT LANGUAGE="JAVASCRIPT">

function first()

{
name=document.myForm.op.value;

alert(name);

}
</SCRIPT>
</HEAD>
<BODY bgcolor=#ffffff>

<CENTER>
<IMG SRC="home.gif">
</CENTER>
<P>
<FORM NAME=myForm>
Name : <INPUT TYPE="text" NAME="op" VALUE=""> <BR>
E-mail : <INPUT TYPE="text" NAME="mail" VALUE=""> <BR> <BR>
<P>
<CENTER>
<IMG SRC="ruler.gif">
<P>
<A HREF="http://users.skynet.be/intec">Homepage </A>
</CENTER>
<BR> <BR>
<INPUT TYPE=button VALUE=Opvragen onClick="first()">
</FORM>
</BODY>
</HTML>

Nu verder met onze oefening.
We vullen de twee tekstvakken in ons formulier in. Bij het aanklikken van de knop "Opvragen" krijgen we in een ALERT box de tekst die in het eerste element staat (dus na Name :). En dat is ook hetgeen we in ons script gezet hebben : name=document.myForm.op.value;
dus de waarde (value) van het element[op] (het eerste tekstvak is element[0]) en van het formulier (myForm)
We kunnen natuurlijk de inhoud van element[1] ook opvragen, dus hetgeen we invullen na E-mail.
Dan zou de coderegel in het script zijn :

name=document.myForm.mail.value;
gezien het tweede element de naam mail heeft (zie in de tag wat er staat na name= ).
Verderdoor zullen we leren hoe de tekst in een andere pagina zetten i.p.v. in een alert box.

Volgende week :Het LOCATION object...