A Jáva testvérkéje: JavaScript

Tartalomjegyzék:

Hasonlóságok és különbségek

Mire jó az egész?

JavaScript programok

JavaScript és HTML

Adatok, változók és kifejezések

Kattintásra induló JavaScript függvény

Állapotsor kezelés

Új ablak nyitása

Mi lesz veled JavaScript?

Nagyjából a Jáva nyelv szélesebb körben ismertté válásával egy idõben SUN és Netscape közösen bejelentett egy másik, a Jávánál egyszerûbbnek szánt programozási technológiát, amely szorosan kötõdött a Netscape böngészõhöz. Ez a JavaScript-nek nevezett nyelv a HTML lapok írói számára készült, célja, hogy kevés munkával interaktív funkciókkal lehessen bõvíteni a HTML lapokat. Ily módon nem csak változatosabbá tehetjük a megjelenõ információkat, de az ûrlapok (forms) kezelésénél a Web szervert is tehermentesíthetjük.

Hasonlóságok és különbségek

Rossz nyelvek szerint a Jáva és a JavaScript nyelvekben mindössze nevük elsõ 4 betûje a közös - mellesleg a JavaScript-et kezdetben Mocha-nak, majd LiveScript-nek hívták de ha ez kissé túlzó állítás, de azért van benne valami. A két nyelvet külön-külön fejlesztgették, a fejlesztõk csak jóval késõn hallottak egymásról. Aztán egyszer csak a Sun és a Netscape egymásra talált és rájöttek arra, hogy ha már hasonló dolgokkal foglalkoznak, ne használjanak teljesen más neveket.

Ha a két gyereknek más-más papája is van, de azért vannak tagadhatatlan hasonlóságok. Például a szintaxisukat mindketten a C nyelvtõl örökölték, no meg a manapság oly divatos objektumorientáltságot egyikük sem kerülhette el. és persze közös a "lakhelyük" is, mind a Jáva programkák, mind a JavaScript parancsok futnak a Netscape böngészõn. Sõt jó hír a makacs, konzervatív Windows 3.11 felhasználóknak nem sértés, én is az vagyok , a JavaScript-et még a Windows-os böngészõ is érti!

Nézzünk néhány különbséget részletesebben is:

Objektumorientáltság:

object based

Fordítás vagy interpretálás:

Típusrendszer:

properties

Kapcsolatuk a HTML-lel:

Sajnos ez véleményem szerint talán csak ideiglenes nagy hiányosság: a JavaScript programok semmilyen módon nem befolyásolhatják a lappal letöltött programkák mûködését.

Mire jó az egész?

A JavaScript programok leggyakoribb felhasználása az ûrlapokhoz kötõdik. A HTTP protokoll lehetõvé teszi, hogy a kitöltött ûrlapot elküldjük szerverre, ahol egy feldolgozó program indul (ún. CGI script) el és fogadja az információkat. Ez a program általában azzal kezdi a tevékenységét, hogy ellenõrzi a kapott paramétereket és hiba esetén visszaküld valamit a böngészõ elõtt ülõ felhasználónak. Ám ez felesleges hálózati terhelést jelent, a feldolgozó program is potyára indult el. Egy kis JavaScript program segíthet a dolgon, elküldés elõtt de akár az egyes mezõk kitöltésekor még a böngészõben ellenõrizheti, hogy megfelelõ adatokat adtunk meg, figyelmeztethet, korrigálhat, ha kell.

A JavaScript felhasználható arra is, hogy a megjelenõ HTML lapot vagy annak részeit dinamikusan, a felhasználó környezetének, általa megadott információknak megfelelõen állítsuk elõ. A programból létrehozott HTML formátumú szöveget a böngészõ ugyanúgy jeleníti meg, mintha az a szerverrõl érkezett volna. Futás közben is változtathatjuk a lap egyes jellemzõit, mint például a színeit vagy egyes ûrlap mezõk tartalmát.

Segítséget kaphatunk ahhoz is, hogy lapjainkat egyedi navigációs lehetõségekkel egészítsük ki. Nyomógombokat definiálhatunk, amelyek különbözõ lapokat hívhatnak elõ, a lapunkat részekre, keretekre (frame) oszthatjuk és az egyes keretek tartalmát függetlenül változtathatjuk. Különbözõ kiegészítõ tevékenységeket végezhetünk egy lapra be- illetve kilépéskor, hivatkozások (link) követésekor.

JavaScript programok korlátozott mértékben befolyásolhatják a böngészõnk mûködését, megjelenését is. Figyelmeztetõ (alert) és megerõsítést kérõ (confirm) ablakokat jeleníthetünk meg, a fent emlegetett kereteken túl akár önálló böngészõ ablakokat nyithatunk meg, sõt ezek fontosabb megjelenési paramétereit pl. mérete, vannak-e menüi, stb. szabadon megadhatjuk. Tájékoztatható szövegeket jeleníthetünk meg az állapotsorban.

JavaScript programok

Megpróbálom röviden összefoglalni a JavaScript nyelv sajátosságait. Terjedelmi okokból csak az érdekesebb vonásokra térek ki, feltételezem, hogy olvasóim valamennyire ismerik a C-t és olvasták a korábbi Jáva cikkeimet is.

JavaScript és HTML

A JavaScript programokat a HTML formátumú dokumentumokba kell beágyazni, erre vezették be a következõ szintaxist.

<SCRIPT LANGUAGE="JavaScript">

<!--

program

//-->

</SCRIPT>

Ahogy a többi HTML elem esetében, itt sem jelent különbséget, ha kis- illetve nagybetûket használunk, azaz a <script> ... </script> ugyanúgy megtenné, viszont a programon belül már a Jávához hasonlóan a kis- és nagybetûk eltérõ jelentéssel bírnak. A language opciót - jelenleg - nem szükséges megadni ugyan, de én célszerûnek tartom, mert a következõkben elõbukkanhatnak más parancsnyelvek is.

A <script> olyan HTML tag, amelyet le kell zárni, ezért egy JavaScript-et értõ böngészõ el tudja különíteni a programot a lap többi részétõl. Azonban ha olyan böngészõt használunk, amely ezt még nem érti, az ugyan magát a <script> és </script> tagokat figyelmen kívül hagyja, viszont a program szövegébe belegabalyodhat. Ezért célszerû a fenti példa szerint a teljes programot HTML megjegyzésbe () zárni.

JavaScript programrészlet a HTML dokumentumban bárhol akár többször is elõfordulhat. A programszöveg értelmezése, végrehajtása a <script> tag teljes betöltése után kezdõdik meg. A JavaScript programban függvények definiálása és végrehajtandó utasítások sorozata keveredhet. A függvénydefiníciók kiértékelése csak a definíció "megjegyzésével" jár, a függvényeket a HTML lap más pontjain, általában a késõbbiekben megismert eseménykezelõkben hívhatjuk meg. Célszerû a lapon felhasznált összes függvényt a lap fejében a <head> és </head> között definiálni.

Az egyszerû programrészleteket a böngészõ azonnal végrehajtja, azaz például a

<HTML>

<HEAD></HEAD>

<BODY>

<SCRIPT LANGUAGE="JavaScript">

document.write("<H1 ALIGN=center>Éljen a <I>JavaScript</I></H1>")

</SCRIPT>

... és vesszenek a vetélytársai!

</BODY>

</HTML>

lap középre kerülõ, nagybetûs "Éljen a JavaScript" szövegét a program állította elõ, míg a "... és vesszenek a vetélytársai!" szöveg a HTML dokumentum statikus része. (Próbáld ki!)

Adatok, változók és kifejezések

A JavaScript programban elõforduló adatok csak a következõ négy különbözõ típusba tartozhatnak: objektum, számérték (amely egyaránt jelenthet egész vagy valós számokat), szöveg (karaktersorozat) és logikai érték (true és false).

A kifejezések szintaxisa nem tér el a C-szerû nyelvekben megszokottaktól, az egyes értékeket megjelenítõ literálokon túl változók illetve függvényhívások is elõfordulhatnak bennük. Kifejezések írásához felhasználhatjuk a C-bõl megismert összes szokásos operátort, beleértve az olyan egzotikusakat is, mint az értékadó operátorok (pl. =+), vagy a feltételes kifejezést (feltétel ? érték1 : érték2) is. Az aritmetikai és összehasonlító operátorok jól tûrik a szövegeket is, szükség esetén szó nélkül konvertálnak szövegek és számértékek között ide-oda, de a parseInt és parseFloat függvényekkel explicit konverziót is elõírhatunk, az eval függvény pedig egy szöveget, mint JavaScript kifejezést értékel ki. Szövegekre itt is értelmezett a + operátor.

Természetesen változókat is használhatunk, a névadási konvenciók a C-bõl ismertek, itt azonban nem kell az egyes változók típusát deklarálni, ugyanazon nevû változó élettartama során tetszõleges típusú értéket hordozhat. Változókat a következõ két módon hozhatunk létre.

var név [= érték]

vagy

név = érték

Az elsõ szerkezet, ha a elhagyjuk az értékadást, akkor nem definiált értékû változót hoz létre. A változók lehetnek globálisak, az egész programban felhasználhatók illetve lokálisak, amelyek csak az adott függvényen belül használhatók, ott viszont elfedhetik az azonos nevû globális változót. Az elsõ fajta deklaráció az elõfordulási helyétõl függõen lehet globális és lokális is, a második az elõfordulásától függetlenül mindig globális.

Utasítások

A JavaScript csak a következõ alapszavakat használja az utasításokhoz:

break	continue	for
for...in	function	if...else
new	return	var
while	with

ám az összes Jáva alapszót is fenntartott, programozók által nem használható szóként kezeli. Az utasítások egy C programozó számára nagy meglepetéseket nem jelentenek, legfeljebb hiányzik nekik a switch szerkezet. Újdonság a for..in, new illetve a with utasítások, ezekrõl majd az objektumoknál szólok.

Függvények definiálására a

function fnév ( paraméterek ) { ... return érték }

forma szolgál. Látjuk, hogy a függvény visszatérési értékének típusát nem kell definiálni, ez is dinamikus, attól függ, hogy a return milyen értéket ad vissza. A függvény törzsében az egyes paraméterekre szokásos módon a nevükkel hivatkozhatunk, de a paramétereket egy tömb elemeiként is elérhetjük, pl. az

fnév.arguments[0]

az elsõ paraméterre hivatkozik, míg az

fnév.arguments.length

a paraméterek számát adja meg, így lehetõséget kapunk változó számú paraméteres függvények írására.

A függvényhívásnál a paraméterátadás érték szerint történik, azaz a függvény ugyan módosíthatja a paraméterként megkapott értéket, de ennek a hívóra semmilyen hatása nem lehet. Aki imádja mellékhatásokkal (side effect) áttekinthetetlenné tenni a programjait, az használjon gyakorta globális változókat.

Objektumok

A JavaScript objektum-modellje sokak számára furcsának tûnhet, engem leginkább a LISP nyelv objektumorientált kiterjesztéseire emlékeztet. A JavaScript objektum <tulajdonság, érték> párok halmaza. Az egyes tulajdonságokhoz (property) az ismert

object.property

szintaxissal hivatkozhatunk, az értékét használhatjuk, módosíthatjuk. Egy objektum létrehozására a new utasítás szolgál, amely által lehívott függvény kitöltheti az objektum tulajdonságainak értékeit. Például:

function person (first, last, age)

{

   this.first_name = first;

   this.last_name  = last;

   this.age        = age;

}

Dezso = new person("Dezsõ", "Nagy", 23);

Dezso.age = 24;

utasítássorozat létrehoz egy objektumot, amely értéket rendel a first_name, last_name, age tulajdonságaihoz, majd életkorát megváltoztatja. A függvényen belül a this az aktuális, esetünkben az éppen létrehozott objektumra hivatkozik.

A JavaScript objektumokat asszociatív tömböknek is tekinthetjük, ahol a tulajdonság nevekhez értékek tartoznak, amelyek a nevek alapján hozzáférhetõk. Ezt az analógiát erõsíti az is, hogy a tulajdonságokhoz az indexelésnek megfelelõ szintaxissal is hozzáférhetünk, pl. a fenti példában írhattuk volna azt is, hogy

Dezso["age"] = 24;

Ezek után nem meglepõ, hogy JavaScript-ben külön tömbök nincsenek. Tömbnek olyan objektumot nevezünk, amely tulajdonságai a 0-tól kezdõdõ egész számok, ezen felül van egy length nevû tulajdonsága a tömb "hosszának" tárolására. Lássunk egy trükkösebb tömb-konstruktor függvényt és felhasználását, amely kihasználja a változó számú paraméteres függvényt:

function initArray()

{

   this.length = initArray.arguments.length;

   for (var i = 0; i < this.length; i++)

     this[i+1] = initArray.arguments[i];

}

mixed = new initArray( "text", 1, 23, Dezso);

Érdekes a példa, látható, hogy a tömb értékei nem feltétlenül azonos típusúak, sõt egy objektum tulajdonságának értéke lehet egy másik objektum is. Természetesen mutatók itt sincsenek, de a null "üres objektum" itt is létezik.

Az egyes objektumokhoz függvényeket is rendelhetünk, így a szokásos módszereket kapjuk. Hosszas magyarázkodás helyett bõvítsük a fenti person példát.

function sayYourName ()

{

   document.write("<B>Szia, "

                  + this.last_name + " " + this.first_name

                  + " vagyok.</B><P>");

}

function person (first, last, age)

{

   this.first_name = first;

   this.last_name  = last;

   this.age        = age;

   this.introduce  = sayYourName;

}

Dezso = new person("Dezsõ", "Nagy", 23);

Dezso.introduce();

A person által létrehozott objektumoknak lesz egy introduce tulajdonsága, amihez egy függvény tartozik. A program vastagon szedve kiírja, hogy "Szia, Nagy Dezsõ vagyok."

Az objektumok összes tulajdonságán a for...in ciklussal lehet végighaladni, a következõ függvény például elõállít egy olyan HTML szöveget, amely a paraméterként megadott (obj) és megnevezett (obj_name) objektum összes tulajdonságát és a hozzá tartozó értéket felsorolja.

function dump_props(obj, obj_name) {

   var result = ""

   for (var i in obj) {

      result += obj_name + "." + i + " = " + obj[i] + "<BR>"

   }

   result += "<HR>"

   return result

}

Beépített objektumok

Ezek a programozási lehetõségek nem sokat érnének, ha nem lennének a JavaScript-ben elõre definiált objektumok, hozzá tartozó tulajdonságaikkal és módszereikkel. Szerencsére számos ilyen objektum van itt fel sem tudom mindet sorolni , ezek jó része a HTML lap egyes elemeire hivatkozik. Megadom a HTML lapokhoz tartozó egy objektumok hierarchiáját. A hierarchiának nincs köze az öröklõdéshez, csupán azt jelenti, hogy a hierarchiában fentebb álló objektum valamely tulajdonsága a lenti objektumot tartalmazza (hivatkozik rá).

window: a böngészõ ablaka,

frames: keretek az ablakban,
location: a megjelent lap URL-je,
history: a böngészõ által bejárt lapok,

document: a konkrét HTML dokumentum,

forms: ûrlapok,

ûrlap elemek: text field, textarea, checkbox, password, radio, select, button, submit, reset

links: hivatkozások
anchors: dokumentum címkék

Ha egy beépített objektumnak több azonos típusú eleme van, akkor azokra vagy tömbszerûen lehet hivatkozni, vagy az elem dokumentumban megadott neve alapján (NAME= opció). Bár minden egyes objektumhoz sok hasznos tulajdonság, módszer tartozik, aminek részletes ismertetésére nincs mód, a példák talán ízelítõt adnak a lehetõségekbõl.

A fenti objektumokon túl van még 2 segéd objektum, a Date (dátum és idõkezelés), Math (matematikai függvények és konstansok).

A JavaScript szövegei string objektumok, amelyeken számos transzformációs, HTML-nek megfelelõ formázó függvény van értelmezve. Például a

var worldString="Hello, world!"

document.write("<P>" + worldString.fontcolor("red"))

programrészlet a "Hello, world!" szöveget piros színben jeleníti meg.

Eseménykezelés

A HTML lapok különbözõ elemeihez magához a laphoz, az egyes hivatkozásokhoz, ûrlap elemekhez a böngészõ az egér mozgatásával, a billentyûzet használatával kapcsolatban különbözõ eseményeket rendel. Az egyes események feldolgozására az új eseménykezelõk (event handler) szolgálnak, amelyeket a megfelelõ HTML elem definíciójánál lehet megadni. Az eseménykezelõ egy tetszõleges JavaScript utasítássorozatot tartalmazhat, leggyakrabban egy függvény meghívását tartalmazza.

A következõ táblázat megadja a lehetséges eseménykezelõk nevét és a lehívását kiváltó esemény. Figyelem, különbözõ HTML elemeknél különbözõ események értelmesek.

onLoad betöltünk egy oldalt a böngészõbe

onUnload kilépünk egy betöltött oldalról

onFocus az ûrlap valamelyik eleme a fókuszba kerül, azaz a billentyûzetrõl érkezõ karaktereket fogadja

onBlur a fókusz elmozdul az ûrlap valamelyik elemérõl

onSelect az ûrlap valamelyik bemeneti mezõjét kiválasztották

onChange az ûrlap valamelyik elemének (szöveg, választás) értékét megváltoztatták

onClick rákattintottak egy ûrlap elemre (pl. nyomógombra), vagy hivatkozásra

onSubmit elküldenek egy ûrlapot a szerver felé (a submit gombra kattintottak)

onMouseOver az egér egy hivatkozás, vagy dokumentum címke fölé kerül

A következõ példa egyszerû kalkulátort valósít meg, ahol a két mezõbe számokat írhatunk, a közöttük lévõ legördülõ listában a 4 alapmûvelet közül választhatunk, majd az egyenlõségjellel ellátott nyomógombot megnyomva az eredmény mezõben megjelenik a számítás eredménye.

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function compute(form)

{

   var operator = form.op.options[form.op.selectedIndex].text

   form.result.value = eval(form.A.value + operator + form.B.value)

}

//-->

</SCRIPT>

</HEAD>

Eddig tartott a dokumentum feje. Figyeljük meg a compute függvény belsejében a paraméterként megkapott ûrlapobjektum egyes részeire a nevükkel hivatkozunk: A és B a két (bementi), result az (eredmény) szövegmezõ, op pedig a mûveletet kiválasztó legördülõ lista. A listán belül a kiválasztott elem sorszámát a selectedIndex módszer adja vissza, ennek segítségével indexelve megkaphatjuk a mûveleti jelet, mint szöveget. Az eval pedig szöveget vár és megpróbálja kifejezésként kiértékelni.

<BODY>

<FORM NAME="calculator">

<INPUT TYPE="text" NAME="A" SIZE=8>

<SELECT NAME=op>

<OPTION>+ <OPTION>- <OPTION>* <OPTION>/

</SELECT>

<INPUT TYPE="text" NAME="B" SIZE=8>

<INPUT TYPE="button" VALUE=" = " onClick="compute(document.calculator)">

<INPUT TYPE="text" NAME="result" SIZE=8>

</FORM>

</BODY>

</HTML>

Az egyenlõségjel feliratú (VALUE=" = ") nyomógombhoz rendeltünk egy eseménykezelõt, amely akkor aktiválódik, ha rákattintottunk (onClick), ekkor meghívja a compute függvényt, átadva neki az aktuális ûrlapot. (Próbáld ki!)

Érdekes trükkök

Ízelítõül szeretnék néhány olyan JavaScript példát mutatni, amely ötleteket adhat HTML lapjaink feldíszítéséhez.

Kattintásra induló JavaScript függvény

A JavaScript megjelenésével kibõvült a böngészõknek megadható címek (URL, Universal Resource Locator) szintaxisa is. Ismeretes, hogy az URL elsõ, a kettõspontig terjedõ része a szerverrel kapcsolattartás protokollját definiálta, pl. http:, ftp:, gopher:. Ez a választék most bõvült a javascript: (vagy az azonos jelentésû, de régies mocha:) taggal. Ezután az URL többi része helyett egy JavaScript utasítást írhatunk, amelyet a hivatkozás aktiválásánál a böngészõ végrehajt. Például a következõ példa azt illusztrálja, hogyan csinálhatunk olyan hivatkozást, amelyre kattintva elõbb egy megerõsítõ kérdést kapunk és csak azt jóváhagyva tölti be a böngészõ az új oldalt.

<HTML>

<HEAD>

<SCRIPT>

<!--

function confirmFollow(link)

{

   if(confirm("Kövessem a " + link + " hivatkozást?"))

      window.location=link;

}

//-->

</SCRIPT>

</HEAD>

<BODY>

Ez itt egy  követésre méltó

<A HREF="javascript:confirmFollow('tetszõleges URL')">hivatkozás</A>?

</BODY>

</HTML>

Látható, hogy a HREF tag egy függvényhívást tartalmaz, amely paraméterként megkaphat egy tetszõleges URL-t (csak arra vigyázzunk, hogy azt aposztrófok és ne idézõjelek közé zárjuk. A confirmFollow függvény akkor tölt csak be új lapot, ha a felbukkanó megerõsítõ kérdésre az OK gomb lenyomásával válaszolunk. Megjegyzendõ, hogy a megerõsítõ ablak nyomógombjainak felirata sajnos - jelenleg? - angol marad, nem változtatható. Ugyancsak változtathatatlan az általunk kiírt szöveg felett az ablakban megjelenõ "JavaScript confirm:" szöveg is.

Állapotsor kezelés

Gyakran használható fortély, hogy a böngészõ állapotsorában különbözõ kiegészítõ üzenetek jelennek meg. Elsõ példaként megmutatom, hogyan lehet az állapotsorba valami magyarázó szöveget kiírni akkor, ha az egér egy hivatkozás fölött áll (normálisan a Netscape az URL-t mutatja meg.) Legegyszerûbben a következõ módon járhatunk el:

<A HREF="URL" onMouseOver="window.status = 'magyarázó szöveg';

return true">kapcsolat</A>

A fenti HREF tag a "kapcsolat" szó fölé állva az egérrel meghívódik az onMouseOver eseménykezelõ, amely egyszerûen az állapotsorba írja a "magyarázó szöveg"-et, majd igaz logikai értékkel visszatér.

A megoldás szépséghibája, hogy ha elmozdulunk az egérrel, az állapotsorban ott marad a kiírt szöveg mindaddig, amíg mást nem írunk mi vagy a böngészõ oda. Sajnos olyan eseménykezelõ nincs, amely akkor indulna be, ha elmozdulunk az egérrel, de az alábbi két egyszerû függvénnyel adott idõzítés után letörölhetjük az állapotsort.

<SCRIPT LANGUAGE="JavaScript">

<!--

function stat(txt)

{

   window.status = txt;

   setTimeout("erase()",1500);

}

function erase()

{

   window.status="";

}

// -->

</SCRIPT>

A stat függvény elõször felülírja az állapotsort, majd a setTimeout hívással egy JavaScript programrészlet itt az erase függvény meghívását idõzíti 1500 msec-kel késõbbre. A fenti függvények segítségével a HREF tagba már elegendõ a stat függvényt lehívni:

<A HREF="URL" onMouseOver="stat('magyarázó szöveg');

return true">kapcsolat</A>

Néhol az állapotsort "fényreklámként" használják, az állapotsorban valamilyen szöveget görgetnek jobbról balra. Bár van, akit ez idegesít, de azért magyarázatok nélkül mutatok egy egyszerû programot. A lényeges trükk az idõzített végrehajtáson túl az, hogy a fényreklám a lap betöltésekor az onLoad esemény hatására indul el.(Próbáld ki!)

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- 

var text = "Ez itt a reklám helye ... ";

var length = text.length;

var width  = 100;

var pos    = 1 - width;

function scroll()

{

   pos++;

   var scrolled = "";

   if (pos == length) pos = 1 - width;

   if (pos < 0)

   {

      for (var i = 1; i <= Math.abs(pos); i++)

         scrolled = scrolled + " ";

      scrolled = scrolled + text.substring(0, width - i + 1);

   }

   else scrolled = scrolled + text.substring(pos, width + pos);

window.status = scrolled;

setTimeout("scroll()",150);

}

//-->

</SCRIPT>

</HEAD>

<BODY onLoad="scroll();return true;">

Ez itt a lap törzse!

</BODY>

</HTML>

Új ablak nyitása

A JavaScript lehetõvé teszi, hogy új böngészõ ablakot nyissunk, sõt ahogy az a következõ példában szereplõ open paramétereibõl már gyanítható, az ablak megjelenését is kézben tarthatjuk. Itt pl. egy olyan ablakot nyitunk meg, amelynek megadjuk pixel-ekben a kezdeti méretét és megtiltjuk, hogy a felhasználó ezt megváltoztassa. Az új ablaknak nem lesz sem eszközsora, sem menüi.

A példa egy olyan lapot jelenít meg, ahol egetlen nyomógomb van, erre rákattintva megnyílik az új ablak is. Az új ablak "Vége" feliratú gombjával le is zárhatjuk azt. (Próbáld ki!)

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function WinOpen() {

   msg=open("","DisplayWindow","toolbar=no,directories=no," +

               "menubar=no,resizable=no,width=300,height=200");

   msg.document.write("<HEAD><TITLE>Hahó!</TITLE></HEAD>");

   msg.document.write("<BODY>");

   msg.document.write("<CENTER><H2 ALIGN=center>Új ablak!</H2></P>");

   msg.document.write("<BR><BR>");

   msg.document.write("<FORM>");

   msg.document.write("<INPUT TYPE='button' VALUE='Vége'" +

                       onclick='window.close()'>");

   msg.document.write("</FORM>");

   msg.document.write("</BODY>");

}

//-->

</SCRIPT>

</HEAD>

<BODY>

<FORM>

<INPUT TYPE="button" VALUE="Kattints rám" onclick="WinOpen()">

</FORM>

</BODY>

</HTML>

Mi lesz veled JavaScript?

Vajon mit hoz a jövõ, mennyire perspektivikus ez a programozási technológia? A HTML dokumentumokkal való szoros összefonódása népszerûvé teszi, apróságokat tényleg könnyen meg lehet a segítségével valósítani. Én mégsem látom a jövõjét olyan biztosnak, mint nagyobb testére, a Jáva jövõjét.

A JavaScript kevésbé dokumentált, mint a Jáva. Ugyan jelentek meg már könyvek errõl is, de azért még vadászni kell a megbízható információk után. Nem könnyíti meg a programozók életét a Netscape sem, az újabb böngészõ verziókkal a nyelv is változik. Sajnos a biztonsági kérdések sincsenek annyira átgondolva, mint a Jáva nyelvnél.

Másik problémának a nyelv támogatottságát érzem. Mivel ez szorosan a böngészõ programokhoz tartozik, önálló JavaScript alkalmazások nem létezhetnek, ezért csak a böngészõket író szoftverházakon múlik, vajon ráharapnak-e. Jelenleg a Netscape böngészõje az egyetlen, amelyik ismeri. A hírek szerint a Microsoft Internet Explorer 3.0-s változata is támogatni fogja, valószínûleg a HotJava-ba is belekerül. Viszont kimaradt a közelmúltban nagy harcok után és kompromisszumokat kötve elfogadott HTML 3.2-es specifikációból.

No meg mások is rájöttek arra, hogy szükség van ilyen egyszerû, böngészõ oldali programozási lehetõségre. Microsoft-éknál az egyszerûséget mindig is a Visual Basic jelentette, õk most nagyon erõltetnek egy erre épülõ, VBscript technológiát. Az Oracle kijött az új böngészõjével, amely saját, ugyancsak a Basic-hez hasonló parancsnyelvet ismer. Na és ha halkan is, de idõnként hallani a SUN-nál dolgozó fejlesztõi csoport véleményét, akik HTML parancsnyelvként a UNIX világban szabadon hozzáférhetõ volta miatt nagyon elterjedt Tcl/Tk technológiát támogatják.

Arra már a fenti szoftvergyártók is rájöttek, hogy valami hasonló eszköz jó lenne a szerver oldali programok írásához, a jelenlegi CGI mechanizmus esetleges, nem hatékony. Mindenki arrafelé kacsintgat, hogy hasonló egyszerû nyelvi eszközzel támogassák ezt a feladatot is. Sõt a Jáva is elmozdult ebbe az irányba, a programkák (applet) mellett már beszélnek "szerverkékrõl" (servlet) is, állítólag már írják a hozzá tartozó API-t.

Kiss István

updated: 96/06/30, http://www.eunet.hu/infopen/cikkek/java/javascr.html

onLoad	betöltünk egy oldalt a böngészõbe
onUnload	kilépünk egy betöltött oldalról
onFocus	az ûrlap valamelyik eleme a fókuszba kerül, azaz a billentyûzetrõl érkezõ karaktereket fogadja
onBlur	a fókusz elmozdul az ûrlap valamelyik elemérõl
onSelect	az ûrlap valamelyik bemeneti mezõjét kiválasztották
onChange	az ûrlap valamelyik elemének (szöveg, választás) értékét megváltoztatták
onClick	rákattintottak egy ûrlap elemre (pl. nyomógombra), vagy hivatkozásra
onSubmit	elküldenek egy ûrlapot a szerver felé (a submit gombra kattintottak)
onMouseOver	az egér egy hivatkozás, vagy dokumentum címke fölé kerül