Xüx fél-fapados kalandjai :)

!Amíg nem olvastuk el a képek alatti szöveget, ne húzzuk rá az egeret a képekre!


Mezei felhasználóként "egerészve" az oldalon, látszólag semmi sem változott az ufo0.html-hez képest, ami a html kód tekintetében igaz is. Viszont abban a pillanatban, amint vigyázó szemünket az oldalhoz csatlakozó Javascript kódra (ufo1.js) vetjük, feltűnik, hogy az, az előző (ufo0.js) kódhoz képest jelentősen megrövidült, mivel 13 helyett immáron csupán egy darab eseménykezelő függvényt tartalmaz. (Szép eredmény persze ez is, de azért jó lenne ha a kezdo nevű függvényt is le tudnánk rövidíteni valahogy. Haladjunk viszont apránként, sor kerül majd arra is.) Addig is, elég azt megértenünk, hogy - mint az a Javascript állományban (ufo1.js) látható, a kezdo nevű függvény, az összes IMG tag-re "ráaggatja" az egyetlen eseménykezelő függvényünket. Jogos persze a kérdés, hogy az esemény bekövetkeztekor, honnan tudható meg az, hogy épp hol történt az esemény (melyik kép fölé húztuk oda az egeret)? A dolog lényege röviden a következő:
Az eseménykezelő függvényben - esetünkben ez az f nevű függvény - lehetőségünk van arra, hogy elérjük az eseményt jelző DOM objektumot a this objektumon keresztül. Így aztán több - esetünkben épp 13 - elem eseményére is "ráuszíthatjuk" ugyanazt a függvény, amin belül elérhető az az objektum, amelyik az eseményt jelezte (amelyik hívta az eseménykezelőt). Röviden ennyi. A következő mappában (ufo2) azt nézzük meg, miként tehető még hatékonyabbá a vonatkozó Javascript kódunk.