JavaScript - Ćwiczenia Praktyczne.pdf

(1089 KB) Pobierz
Spis Treści
SPIS TREŚCI
....................................................................................................................................................................... 1
ROZDZIAŁ 1
. PODSTAWY............................................................................................................................................... 3
C
ZYM JEST
J
AVA
S
CRIPT
? ....................................................................................................................................................................... 3
J
AVA
S
CRIPT A
J
AVA
.............................................................................................................................................................................. 3
C
O NAM BĘDZIE POTRZEBNE
? ................................................................................................................................................................ 4
ROZDZIAŁ 2
. PIERWSZE SKRYPTY ............................................................................................................................. 5
Z
NACZNIK
<SCRIPT> ........................................................................................................................................................................... 5
I
NSTRUKCJA DOCUMENT
.
WRITE
............................................................................................................................................................. 5
K
OMENTARZE
........................................................................................................................................................................................ 7
Komentarz HTML ............................................................................................................................................................................. 7
Komentarz typu // .............................................................................................................................................................................. 7
Komentarz blokowy ........................................................................................................................................................................... 8
Znacznik <NOSCRIPT> ................................................................................................................................................................... 8
F
ORMATOWANIE TEKSTU
....................................................................................................................................................................... 9
O
KNO DIALOGOWE
.............................................................................................................................................................................. 11
ROZDZIAŁ 3
. ELEMENTY JĘZYKA JAVASCRIPT .................................................................................................. 13
T
YPY DANYCH
J
AVA
S
CRIPT
................................................................................................................................................................. 13
Typ liczbowy.................................................................................................................................................................................... 13
Wartości logiczne ............................................................................................................................................................................ 14
Łańcuchy znaków ............................................................................................................................................................................ 14
Wartość NULL ................................................................................................................................................................................ 14
Z
MIENNE
.............................................................................................................................................................................................. 14
W
PROWADZANIE DANYCH
................................................................................................................................................................... 15
I
NSTRUKCJE WARUNKOWE
................................................................................................................................................................... 17
O
PERACJE NA ZMIENNYCH
................................................................................................................................................................... 18
Operacje arytmetyczne .................................................................................................................................................................... 18
Operacje na bitach .......................................................................................................................................................................... 20
Operacje przypisania ...................................................................................................................................................................... 20
Operacje logiczne i porównania ..................................................................................................................................................... 21
Operacje na łańcuchach znaków .................................................................................................................................................... 21
I
NSTRUKCJA PRZETWARZANIA WARUNKOWEGO
.................................................................................................................................. 22
P
ĘTLE
.................................................................................................................................................................................................. 26
Pętla for .......................................................................................................................................................................................... 26
Pętla while ...................................................................................................................................................................................... 29
ROZDZIAŁ 4
. OBIEKTY I FUNKCJE ........................................................................................................................... 30
F
UNKCJE
.............................................................................................................................................................................................. 30
R
EKURENCJA
....................................................................................................................................................................................... 31
O
BIEKTY
.............................................................................................................................................................................................. 34
Łańcuchy znaków (obiekt string) .................................................................................................................................................... 36
Obiekt Math .................................................................................................................................................................................... 38
Obiekt Date ..................................................................................................................................................................................... 40
Obiekt document ............................................................................................................................................................................. 42
Obiekt window ................................................................................................................................................................................ 45
ROZDZIAŁ 5
. ZDARZENIA I FORMULARZE ........................................................................................................... 48
Z
DARZENIA ON
L
OAD I ON
U
NLOAD
...................................................................................................................................................... 48
Z
DARZENIA ZWIĄZANE Z MYSZĄ
.......................................................................................................................................................... 50
F
ORMULARZE
...................................................................................................................................................................................... 52
E
LEMENTY FORMULARZY
.................................................................................................................................................................... 56
Element button ................................................................................................................................................................................ 57
Element checkbox............................................................................................................................................................................ 57
Element hidden................................................................................................................................................................................ 58
Element radio .................................................................................................................................................................................. 59
Element reset ................................................................................................................................................................................... 60
Element select ................................................................................................................................................................................. 61
Element text..................................................................................................................................................................................... 62
Element textarea ............................................................................................................................................................................. 63
W
YKORZYSTANIE FORMULARZY I ZDARZEŃ
........................................................................................................................................ 64
ROZDZIAŁ 6
. OKNA, RAMKI I CIASTECZKA .......................................................................................................... 69
O
KNA
................................................................................................................................................................................................... 69
R
AMKI
................................................................................................................................................................................................. 72
C
IASTECZKA
,
CZYLI COOKIES
.............................................................................................................................................................. 74
JavaScript. Ćwiczenia praktyczne
2
1.
Podstawy
Rozdział
Czym jest JavaScript?
JavaScript tak naprawdę narodził się w firmie Netscape jako LiveScript, język skryptowy rozszerzający standardowy HTML
m.in. o możliwość interakcji z użytkownikiem przeglądającym stronę. Nieco później doszło do porozumienia między firma-
mi Netscape i Sun Microsystems, w wyniku którego pod koniec 1995 roku światło dzienne ujrzał JavaScript. Język ten
umożliwia tworzenie zagnieżdżonych bezpośrednio w kodzie HTML krótkich programów, które potrafią rozpoznać i od-
powiednio zareagować na zdarzenia powodowane przez użytkownika. Zdarzenia te to np. kliknięcie myszą, wypełnianie
formularza, czy nawigowanie między stronami. Przykładowo, można stworzyć skrypt, który będzie sprawdzał poprawność
danych wprowadzonych przez użytkownika do formularza (np. czy wprowadzając jakąś datę, nie przekroczyliśmy dopusz-
czalnej liczby dni w danym miesiącu) i który będzie informował o ewentualnym błędzie. Sprawdzenie takie odbywać się
będzie na komputerze przeglądającego stronę, nie nastąpi więc konieczność dodatkowej transmisji danych w sieci. Spraw-
dzaniem danych nie będzie musiał też zajmować się serwer.
JavaScript a Java
JavaScript, jak sama nazwa wskazuje, ma sporo wspólnego z językiem programowania Java, opracowanym w firmie Sun
Microsystems. Niemniej nie należy tych dwóch języków mylić. Przede wszystkim zostały one stworzone do zupełnie różnych
celów. Java to wywodzący się m.in. z C++ w pełni obiektowy język programowania, za pomocą którego można tworzyć
skomplikowane aplikacje niezależne od platformy sprzętowej. JavaScript jest interpretowanym językiem skryptowym, słu-
żącym do tworzenia niewielkich programów rozszerzających możliwości HTML-u w zakresie opisu stron WWW. Krótkie
zestawienie najważniejszych cech Javy i JavaScript znajduje się w tabeli 1.1.
Tabela 1.1.
Podstawowe różnice pomiędzy językami Java a JavaScript
JavaScript
Język interpretowany na komputerze klienta
Java
Język kompilowany do tzw. b-kodu,
wykonywanego następnie za pomocą wirtualnej
maszyny Javy na komputerze klienta
Język zorientowany obiektowo z obsługą
wszystkich mechanizmów obiektowości
Kod programu jest niezależny od kodu HTML
i znajduje się w oddzielnych plikach
Zmienne i ich typ muszą być zadeklarowane
przed ich użyciem w programie
Wszystkie odwołania do obiektów i funkcji są
sprawdzane na etapie kompilacji
Ze względów bezpieczeństwa aplety,
(w przeciwieństwie do aplikacji) nie mają
możliwości zapisu na dysk twardy
Język oparty na predefiniowanych obiektach,
niepozwalający jednak na stosowanie mechanizmów
programowania obiektowego jak np. dziedziczenie
Kod programu jest zagnieżdżony w kodzie HTML
Zmienne i ich typ nie muszą być deklarowane przed
użyciem
Odwołania do obiektów i funkcji są wykonywane
podczas uruchamiania programu
Ze względów bezpieczeństwa nie ma możliwości
zapisu na dysk twardy
Co nam będzie potrzebne?
Przede wszystkim dobre chęci. Oprócz tego żadne specjalne narzędzia nie będą przydatne. Musimy oczywiście mieć zain-
stalowaną przeglądarkę WWW. Najlepiej Microsoft Internet Explorer lub Netscape Navigator. Nie muszą to być najnowsze
wersje, niemniej jednak nie niższe niż 3.0.
Do pisania samego kodu potrzebny będzie dowolny, najprostszy edytor tekstowy np. systemowy Notatnik. Będzie to nasz
warsztat pracy.
Potrzebna będzie też przynajmniej podstawowa znajomość HTML-u, nie jest natomiast konieczna znajomość innych języ-
ków programowania.
JavaScript. Ćwiczenia praktyczne
4
2.
Pierwsze skrypty
Rozdział
Na początku zajmijmy się klasycznym przykładem, od którego zaczyna się większość kursów programowania. Postarajmy
się wyświetlić na ekranie dowolny napis np.
Jaki miły mamy dzień!
. Aby tego dokonać, wpierw musimy dowiedzieć
się, w jaki sposób umieszczać skrypty JavaScript w kodzie HTML oraz jaka instrukcja JavaScript pozwala pisać na ekra-
nie.
Znacznik <SCRIPT>
Kod
JavaScript
musi
być
umieszczony
pomiędzy
znacznikami
HTML
<SCRIPT>
i
</SCRIPT>
. Znaczniki te można umieszczać w dowolnym miejscu dokumentu, jednak przyjmuje się, że jeżeli jest to tyl-
ko możliwe, należy umieścić je na początku pliku HTML przed znacznikiem
<BODY>
.
Znacznik ten powinien zawierać parametr
LANGUAGE
, który może przyjmować dwie wartości:
LiveScript
lub
JavaScript
. Wartość
LiveScript
jest pozostałością po wczesnych wersjach języka i służy zachowaniu kompatybilno-
ści. Powinniśmy użyć wartości
JavaScript
.
Ćwiczenie 2.1.
Umieść w standardowym kodzie HTML znacznik
<SCRIPT>
.
<HTML>
<HEAD>
</HEAD>
<SCRIPT
language = "JavaScript">
</SCRIPT>
<BODY>
</BODY>
</HTML>
Na listingu znajduje się poprawny kod HTML z zawartym znacznikiem
<SCRIPT>
. Jednak po wczytaniu tego pliku do prze-
glądarki otrzymamy pustą stronę. Brakuje nam instrukcji pozwalającej wyświetlać tekst.
Instrukcja document.write
Instrukcja
document.write()
pozwala na wyprowadzenie tekstu na ekran przeglądarki. Tekst, który chcemy wyświetlić,
należy ująć w nawiasy i cudzysłowy i podać zaraz za
document.write()
np.
document.write ("Jaki miły mamy dzień!")
Ćwiczenie 2.2.
Napisz skrypt wyświetlający tekst
„Jaki miły mamy dzień
!
”
na ekranie przeglądarki.
<HTML>
<HEAD>

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin