[ Pobierz całość w formacie PDF ]
po zadaniu wszystkich pyta .
Zapisz uko czony wcze niej plik 5.1.html i wy wietl go w przegl darce. Tym razem
przegl darka wy wietli stron przed zadaniem pyta (dolna cz rysunku 5.4). Jest
to efekt u ycia instrukcji window.onload=doQuiz, która stanowi dla interpretera
informacj nakazuj c uruchomienie quizu dopiero po wczytaniu i wy wietleniu
strony. To rozwi zanie nie tylko wygl da du o lepiej (pusta strona mo e rozprasza
uwag ), ale jest niezb dne, je li chcesz u ywa modelu DOM do manipulowania
zawarto ci strony.
Kod JavaScript na omawianej stronie znajduje si przed kodem HTML. W czasie
wczytywania strony przegl darka nie ma informacji o fragmentach HTML z ko -
cowej cz ci strony. Dlatego akapit, w którym skrypt ma wy wietla wynik ( Liczba
punktów: 3 z 3. ), dla przegl darki jeszcze nie istnieje. Je li spróbujesz uruchomi
167
ROZDZIA 5. DYNAMICZNE MODYFIKOWANIE STRON WWW
Wprowadzenie
do modelu DOM
Rysunek 5.4. Kiedy uruchomisz program JavaScript przed wczytaniem strony, nie b dzie ona widoczna do
momentu zako czenia dzia ania skryptu. Na stronie widocznej w górnej cz ci rysunku kod JavaScript musi zako czy
zadawanie pyta , zanim przegl darka b dzie mog a wy wietli stron . Je li jednak u yjesz zdarzenia onload,
przegl darka wczyta i wy wietli stron , a dopiero wtedy uruchomi skrypt (dolna cz rysunku)
nowy kod JavaScript natychmiast (przed wczytaniem kodu HTML), przegl darka
poinformuje o b dzie w momencie, kiedy skrypt b dzie chcia pobra znacznik
i zapisa w nim komunikat. Problem wynika z tego, e interpreter nie ma informacji
o tym znaczniku.
168
CZ I WPROWADZENIE DO J ZYKA JAVASCRIPT
Wprowadzenie
do modelu DOM
Dlatego w kroku 4. umie ci e w funkcji p tl , kod generuj cy komunikat, a tak e
kod, który pobiera znacznik i zapisuje w nim informacje. Dzi ki tej funkcji prze-
gl darka mo e wczyta stron i umie ci j w pami ci, a dopiero potem wykona
wszystkie operacji zwi zane z quizem.
Mo esz si zastanawia , dlaczego po funkcji w wierszu window.onload=doQuiz nie
ma nawiasów. Na stronie 107 dowiedzia e si , e w wywo aniach funkcji zaw-
sze nale y ich u ywa (na przyk ad doQuiz()). Nawiasy powoduj , e funkcja jest
uruchamiana natychmiast. Dlatego wiersz window.onload=doQuiz() spowo-
duje natychmiastowe przeprowadzenie quizu, jeszcze przed wczytaniem strony.
Jednak instrukcja window.onload=doQuiz tylko okre la funkcj , bez jej wywo y-
wania. Skrypt uruchomi t funkcj dopiero po wczytaniu strony. Skomplikowa-
ne? To prawda, jednak w a nie tak dzia a j zyk JavaScript. Wi cej informacji o tej
technice znajdziesz na stronie 217.
Wady modelu DOM
Model DOM to warto ciowe narz dzie dla programistów u ywaj cych j zyka
JavaScript, jednak ma te kilka wad. Na stronie 162 zobaczy e , e poruszanie si
mi dzy w z ami modelu DOM jest czasoch onne. Ponadto model DOM udost p-
nia tylko kilka sposobów uzyskania dost pu do znaczników za pomoc iden-
tyfikatorów i nazw tagów. Nie mo na w wygodny sposób znale na przyk ad wszyst-
kich znaczników okre lonej klasy, co jest przydatne przy manipulowaniu zbiorem
powi zanych elementów, takich jak rysunki o klasie slideshow u ywane w pokazie
slajdów opartym na j zyku JavaScript.
Nast pnym utrudnieniem s ró nice w obs udze modelu DOM przez poszczególne
przegl darki. Techniki opisane na poprzednich stronach dzia aj we wszystkich
przegl darkach, jednak niektóre elementy standardu DOM sprawiaj problemy.
Przegl darka Internet Explorer obs uguje zdarzenia inaczej ni pozosta e przegl -
darki, ten sam kod HTML mo e da inn liczb w z ów w przegl darkach Firefox
i Safari ni w Internet Explorerze, a ponadto Internet Explorer nie zawsze pobiera
atrybuty znaczników HTML w taki sam sposób, jak robi to Firefox, Safari i Ope-
ra. Ponadto poszczególne przegl darki w odmienny sposób traktuj odst py (na
przyk ad tabulacje i spacje) w kodzie HTML niektóre przy ich napotkaniu tworz
nowe w z y (Firefox i Safari), a Internet Explorer ignoruje takie znaki. A to tylko
kilka ró nic w obs udze modelu DOM przez najpopularniejsze przegl darki!
Przezwyci enie takich problemów w kodzie JavaScript jest tak powa nym zagad-
nieniem, e mo na po wi ci mu ca (bardzo nudn ) ksi k . W wielu pozycjach
dotycz cych tego j zyka znajduj si d ugie opisy kodu potrzebnego do zapewnienia
prawid owego dzia ania stron w ró nych przegl darkach. Jednak ycie jest zbyt
krótkie, aby zaprz ta sobie g ow takimi problemami. Lepiej zaj si tworzeniem
interaktywnych interfejsów u ytkownika i dodawaniem ciekawych efektów do
witryn, zamiast zastanawia si , co zrobi , aby kod dzia a tak samo w Internet Explo-
rerze, Firefoksie, Safari i Operze. Dlatego w tej ksi ce pomini to wiele przyt acza-
[ Pobierz całość w formacie PDF ]