javascript. Ćwiczenia praktyczne full version.pdf

(12129 KB) Pobierz
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
IDZ DO
JavaScript.
Æwiczenia praktyczne
SPIS TRECI
KATALOG KSI¥¯EK
Autor: Marcin Lis
ISBN: 83-7197-725-5
Format: B5, stron: 106
KATALOG ONLINE
ZAMÓW DRUKOWANY KATALOG
TWÓJ KOSZYK
Zapraszamy do lektury kolejnej ksi¹¿ki z serii Æwiczenia praktyczne dotycz¹cych
technologii tworzenia internetowych stron WWW. Tym razem prezentujemy JavaScript,
czyli jêzyk skryptowy wzbogacaj¹cy mo¿liwoci oferowane przez HTML.
Ksi¹¿ka nie jest suchym omówieniem wszystkich konstrukcji i obiektów
udostêpnianych przez jêzyk, jest natomiast praktycznym wprowadzeniem do
programowania w JavaScript. Sk³ada siê z szeregu æwiczeñ, które przedstawione s¹
w  postaci gotowej do uruchomienia w dowolnej przegl¹darce obs³uguj¹cej jêzyki
skryptowe.
JavaScript to ju¿ obecnie obowi¹zuj¹cy standard, jest to równie¿ jeden ze sk³adników
DHTML. Pozwala na tworzenie efektów niedostêpnych w standardowym HTML,
efektów które niegdy trzeba by³o tworzyæ pomocy technologii takich jak np. skrypty
CGI. Przy czym równoczenie jest to prosty jêzyk skryptowy, którego zrozumienie
i  nauka nie powinna sprawiæ nikomu ¿adnego problemu. Niew¹tpliwie jest to wiêc
technologia warta poznania.
Ksi¹¿ka przeznaczona jest dla osób pocz¹tkuj¹cych, dopiero zaczynaj¹cych swoj¹
przygodê z jêzykami skryptowymi. Autor zak³ada jednak, ¿e czytelnik zna przynajmniej
podstawy jêzyka HTML i jest w stanie samodzielnie utworzyæ proste strony. Nie jest
natomiast potrzebna znajomoæ klasycznych jêzyków programowania takich jak C,
C++ czy Java.
DODAJ DO KOSZYKA
CENNIK I INFORMACJE
ZAMÓW INFORMACJE
O NOWOCIACH
ZAMÓW CENNIK
CZYTELNIA
FRAGMENTY KSI¥¯EK ONLINE
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
854430622.025.png 854430622.026.png 854430622.027.png 854430622.028.png 854430622.001.png 854430622.002.png 854430622.003.png 854430622.004.png 854430622.005.png 854430622.006.png 854430622.007.png 854430622.008.png 854430622.009.png 854430622.010.png 854430622.011.png 854430622.012.png
 
Rozdział 1. Podstawy...............................................................................................................................................5
Czym jest JavaScript?................................................................................................... 5
JavaScript a Java........................................................................................................... 5
Co nam bdzie potrzebne?............................................................................................ 6
Rozdział 2. Pierwsze skrypty................................................................................................................................7
Znacznik <SCRIPT> .................................................................................................... 7
Instrukcja document.write ............................................................................................ 8
Komentarze................................................................................................................... 9
Komentarz HTML................................................................................................................9
Komentarz typu //...............................................................................................................10
Komentarz blokowy............................................................................................................11
Znacznik <NOSCRIPT>.....................................................................................................11
Formatowanie tekstu................................................................................................... 13
Okno dialogowe.......................................................................................................... 15
Rozdział 3. Elementy jzyka JavaScript........................................................................................................17
Typy danych JavaScript.............................................................................................. 17
Typ liczbowy......................................................................................................................17
Warto)ci logiczne...............................................................................................................18
Ła-cuchy znaków...............................................................................................................19
Warto)0 NULL...................................................................................................................19
Zmienne...................................................................................................................... 19
Wprowadzanie danych................................................................................................ 21
Instrukcje warunkowe................................................................................................. 23
Operacje na zmiennych .............................................................................................. 24
Operacje arytmetyczne.......................................................................................................25
Operacje na bitach..............................................................................................................27
Operacje przypisania ..........................................................................................................28
Operacje logiczne i porównania.........................................................................................28
Operacje na ła-cuchach znaków.........................................................................................29
Instrukcja przetwarzania warunkowego..................................................................... 31
Ptle ............................................................................................................................ 35
P7tla for...............................................................................................................................35
P7tla while..........................................................................................................................39
Rozdział 4. Obiekty i funkcje............................................................................................................................. 41
Funkcje ....................................................................................................................... 41
Rekurencja.................................................................................................................. 43
Obiekty ....................................................................................................................... 47
Ła-cuchy znaków (obiekt string).......................................................................................50
854430622.013.png
2
JavaScript. wiczenia praktyczne
Obiekt Math........................................................................................................................53
Obiekt Date.........................................................................................................................55
Obiekt document.................................................................................................................57
Obiekt window....................................................................................................................62
Rozdział 5. Zdarzenia i formularze................................................................................................................65
Zdarzenia onLoad i onUnload.................................................................................... 65
Zdarzenia zwi5zane z mysz5 ...................................................................................... 68
Formularze.................................................................................................................. 70
Elementy formularzy.................................................................................................. 77
Element button....................................................................................................................78
Element checkbox...............................................................................................................78
Element hidden...................................................................................................................80
Element radio......................................................................................................................81
Element reset......................................................................................................................82
Element select.....................................................................................................................84
Element text........................................................................................................................86
Element textarea.................................................................................................................87
Wykorzystanie formularzy i zdarze9.......................................................................... 88
Rozdział 6. Okna, ramki i ciasteczka............................................................................................................95
Okna............................................................................................................................95
Ramki........................................................................................................................ 100
Ciasteczka, czyli cookies.......................................................................................... 103
Na pocztku zajmijmy si klasycznym przykładem, od którego zaczyna si wikszo
kursów programowania. Postarajmy si wywietli na ekranie dowolny napis np.
. Aby tego dokona, wpierw musimy dowiedzie si, w jaki sposób
umieszcza skrypty JavaScript w kodzie HTML oraz jaka instrukcja JavaScript pozwala
pisa na ekranie.
Kod JavaScript musi by umieszczony pomidzy znacznikami HTML
i . Znaczniki te mo+na umieszcza w dowolnym miejscu dokumentu, jednak
przyjmuje si, +e je+eli jest to tylko mo+liwe, nale+y umieci je na pocztku pliku
HTML przed znacznikiem .
Znacznik ten powinien zawiera parametr
, który mo+e przyjmowa dwie
wartoci: !"#$% lub !"#$% . Warto !"#$% jest pozostałoci po wcze-
snych wersjach jzyka i słu+y zachowaniu kompatybilnoci. Powinnimy u+y wartoci
!"#$% .
wiczenie 2.1.
Umie w standardowym kodzie HTML znacznik .
854430622.014.png 854430622.015.png 854430622.016.png
8
JavaScript. wiczenia praktyczne
Na listingu znajduje si poprawny kod HTML z zawartym znacznikiem . Jednak
po wczytaniu tego pliku do przegldarki otrzymamy pust stron. Brakuje nam instrukcji
pozwalajcej wywietla tekst.
Instrukcja &"'(%)*#%+, pozwala na wyprowadzenie tekstu na ekran przegldarki.
Tekst, który chcemy wywietli, nale+y uj w nawiasy i cudzysłowy i poda zaraz za
&"'(%)*#%+, np.
!"#$%&#&'()!*
wiczenie 2.2.
Napisz skrypt wywietlajcy tekst - ! - na ekranie przegldarki.
+,-./0!-&,!0!1+23+#404-5567-8!
2#9#90!"#/#,!
!"#$%&#&'()!*
Tak przygotowany kod spowoduje, +e na ekranie pojawi si po+dany napis (rysunek 2.1).
Warto zwróci uwag, +e w celu poprawnej interpretacji polskich liter przez przegldark
dodalimy w sekcji . znacznik / 0%%$12'!3-&(%(%1$-"&(%(%3-%4%
0%56"0#7%37&1889:1;-
Rysunek 2.1.
Efekt działania
instrukcji
document.write()
Przeanalizujmy nieco dokładniej fragment kodu odpowiedzialny za wywietlanie tekstu
na ekranie. Wszystkim, którzy mieli ju+ wczeniej do czynienia z jzykiem C bd: C++,
składnia wydaje si z pewnoci znajoma:
!"#$%&#&'(!*
&"'(% to obiekt, który reprezentuje aktualn stron. *#% to tzw. metoda, czyli pew-
na funkcja działajca na obiekcie &"'(% i, w tym przypadku, wywietlajca na ekranie
tekst. Tekst ten podajemy jako argument w nawiasach. Ogólnie mo+na zapisa:
:$# #9&&*
854430622.017.png 854430622.018.png 854430622.019.png 854430622.020.png 854430622.021.png 854430622.022.png 854430622.023.png 854430622.024.png
 
Zgłoś jeśli naruszono regulamin