Darmowy fragment publikacji:
Wszelkie prawa zastrzeżone. Nieautoryzowane rozpowszechnianie całości lub fragmentu niniejszej
publikacji w jakiejkolwiek postaci jest zabronione. Wykonywanie kopii metodą kserograficzną,
fotograficzną, a także kopiowanie książki na nośniku filmowym, magnetycznym lub innym
powoduje naruszenie praw autorskich niniejszej publikacji.
Wszystkie znaki występujące w tekście są zastrzeżonymi znakami firmowymi
bądź towarowymi ich właścicieli.
Autor oraz Wydawnictwo HELION dołożyli wszelkich starań, by zawarte w tej książce informacje
były kompletne i rzetelne. Nie biorą jednak żadnej odpowiedzialności ani za ich wykorzystanie,
ani za związane z tym ewentualne naruszenie praw patentowych lub autorskich. Autor oraz
Wydawnictwo HELION nie ponoszą również żadnej odpowiedzialności za ewentualne szkody
wynikłe z wykorzystania informacji zawartych w książce.
Redaktor prowadzący: Michał Mrowiec
Projekt okładki: Studio Gravite / Olsztyn
Obarek, Pokoński, Pazdrijowski, Zaprucki
Fotografia na okładce została wykorzystana za zgodą Shutterstock.com
Wydawnictwo HELION
ul. Kościuszki 1c, 44-100 GLIWICE
tel. 32 231 22 19, 32 230 98 63
e-mail: helion@helion.pl
WWW: http://helion.pl (księgarnia internetowa, katalog książek)
Drogi Czytelniku!
Jeżeli chcesz ocenić tę książkę, zajrzyj pod adres
http://helion.pl/user/opinie/jjq131
Możesz tam wpisać swoje uwagi, spostrzeżenia, recenzję.
Kody źródłowe wybranych przykładów dostępne są pod adresem:
ftp://ftp.helion.pl/przyklady/jjq131.zip
ISBN: 978-83-246-9997-1
Copyright © Helion 2015
Printed in Poland.
• Kup książkę
• Poleć książkę
• Oceń książkę
• Księgarnia internetowa
• Lubię to! » Nasza społeczność
Spis tre(cid:264)ci
Wst(cid:246)p .............................................................................................. 7
Rozdzia(cid:228) 1. Podstawy ....................................................................................... 17
Gdy przegl(cid:261)darka nie obs(cid:225)uguje JavaScript .................................................................... 17
Aby autor nie zapomnia(cid:225), co mia(cid:225) na my(cid:286)li .................................................................... 20
Rozdzia(cid:228) 2. Pisanie na stronie i dzia(cid:228)ania na zmiennych ..................................... 23
Jak umie(cid:286)ci(cid:252) tekst na stronie? ......................................................................................... 23
Jak manipulowa(cid:252) tekstem wy(cid:286)wietlanym na stronie? ..................................................... 27
Operatory ........................................................................................................................ 30
Operatory arytmetyczne ........................................................................................... 30
Operatory przypisania .............................................................................................. 35
Operatory porównania .............................................................................................. 41
Operatory logiczne ................................................................................................... 44
Rozdzia(cid:228) 3. Funkcje i obiekty ........................................................................... 47
Jak zdefiniowa(cid:252) funkcj(cid:266)? ................................................................................................ 47
Funkcja zwracaj(cid:261)ca warto(cid:286)(cid:252) ........................................................................................... 50
Zasi(cid:266)g zmiennych ........................................................................................................... 51
Funkcje predefiniowane JavaScript ................................................................................ 57
Obiekty ........................................................................................................................... 61
Rozdzia(cid:228) 4. Instrukcje warunkowe i p(cid:246)tle .......................................................... 71
Instrukcja if ..................................................................................................................... 71
Instrukcja if... else .......................................................................................................... 76
Instrukcja switch ............................................................................................................. 78
Operator warunkowy ...................................................................................................... 80
P(cid:266)tla while ...................................................................................................................... 81
P(cid:266)tla do-while ................................................................................................................. 86
P(cid:266)tla for .......................................................................................................................... 90
Rozdzia(cid:228) 5. Tablica .......................................................................................... 93
Rozdzia(cid:228) 6. Obliczenia .................................................................................... 111
Obiekt Boolean ............................................................................................................. 111
Obiekt Date ................................................................................................................... 115
Metody ................................................................................................................... 117
Obiekt Math .................................................................................................................. 120
Kup książkęPoleć książkę 4
JavaScript i jQuery. 131 praktycznych skryptów
Rozdzia(cid:228) 7. Liczby i (cid:228)a(cid:254)cuchy .......................................................................... 123
Obiekt Number ............................................................................................................. 123
Rozdzia(cid:228) 8. Teksty ......................................................................................... 139
W(cid:225)a(cid:286)ciwo(cid:286)ci i metody ................................................................................................... 142
Rozdzia(cid:228) 9. Zdarzenia ..................................................................................... 153
Rozdzia(cid:228) 10. JavaQuery .................................................................................... 169
Sk(cid:225)adnia ........................................................................................................................ 169
Dobra praktyka ............................................................................................................. 170
Selektory jQuery ........................................................................................................... 170
Akapit ..................................................................................................................... 170
Identyfikator ........................................................................................................... 172
Gwiazdka ............................................................................................................... 175
Element bie(cid:298)(cid:261)cy ..................................................................................................... 177
Dwa selektory ......................................................................................................... 179
Pierwsza pozycja listy ............................................................................................ 180
Selektor href ........................................................................................................... 184
Nag(cid:225)ówki ................................................................................................................ 186
Ci(cid:261)g znaków ........................................................................................................... 187
Has(cid:225)o ...................................................................................................................... 188
Przycisk radiowy .................................................................................................... 190
Pole wyboru ........................................................................................................... 191
Przycisk wysy(cid:225)ania ................................................................................................. 192
Obrazek .................................................................................................................. 194
Plik ......................................................................................................................... 195
Elementy mo(cid:298)liwe do zmiany ................................................................................ 197
Elementy zablokowane ........................................................................................... 199
Pozycja wst(cid:266)pnie wybrana na li(cid:286)cie rozwijanej ...................................................... 200
Wst(cid:266)pnie zaznaczone pole wyboru ......................................................................... 201
Rozdzia(cid:228) 11. Efekty ......................................................................................... 205
Zdarzenia ...................................................................................................................... 205
Sk(cid:225)adnia dla metod zdarze(cid:276) jQuery .............................................................................. 205
Za(cid:225)adowanie dokumentu ........................................................................................ 206
Klikni(cid:266)cie ............................................................................................................... 207
Podwójne klikni(cid:266)cie ............................................................................................... 209
Naprowadzenie wska(cid:296)nika myszy na element HTML ........................................... 211
Usuni(cid:266)cie wska(cid:296)nika myszy z elementu HTML .................................................... 213
Wci(cid:286)ni(cid:266)cie klawisza myszy .................................................................................... 214
Zwolnienie klawisza myszy ................................................................................... 216
Naprowadzenie i zwolnienie wska(cid:296)nika myszy ..................................................... 218
Umieszczenie wska(cid:296)nika myszy w polu ................................................................. 220
Reakcja na wiele zdarze(cid:276) ....................................................................................... 222
Zmiana tekstu ......................................................................................................... 224
Klonowanie akapitów ............................................................................................. 226
Identyfikacja elementu docelowego zdarzenia ....................................................... 229
Dane przekazywane do metody obs(cid:225)ugi zdarze(cid:276) .................................................... 230
Rozdzia(cid:228) 12. Manipulacja znacznikami HTML .................................................... 233
Tekst ............................................................................................................................. 233
HTML ........................................................................................................................... 235
Warto(cid:286)ci pola formularza ............................................................................................. 237
Odczytywanie atrybutów .............................................................................................. 239
Kup książkęPoleć książkę Spis tre(cid:264)ci
5
Zmiana atrybutów ......................................................................................................... 240
Dodawanie nowego elementu HTML za istniej(cid:261)cym elementem ................................. 242
Dodawanie nowego elementu HTML przed istniej(cid:261)cym elementem ........................... 244
Dodawanie nowego elementu HTML we wskazanym miejscu .................................... 246
Usuwanie elementów .................................................................................................... 250
Usuwanie elementów podrz(cid:266)dnych .............................................................................. 252
Filtrowanie elementów do ukrycia ............................................................................... 254
Zmiana t(cid:225)a wyró(cid:298)nionych elementów ........................................................................... 257
Dodanie klasy do arkusza CSS ..................................................................................... 259
Usuni(cid:266)cie klasy z arkusza CSS ..................................................................................... 263
Prze(cid:225)(cid:261)czenie klasy z arkusza CSS ................................................................................. 265
Rozdzia(cid:228) 13. Witalizacja strony ........................................................................ 269
Zmiana wymiarów obiektu ........................................................................................... 269
Zanikanie i pojawianie si(cid:266) elementów strony ............................................................... 273
Przesuwanie elementów strony ..................................................................................... 279
Animacje ...................................................................................................................... 282
Zako(cid:276)czenie operacji .................................................................................................... 297
(cid:224)a(cid:276)cuchy polece(cid:276) ......................................................................................................... 300
Zmiana parametrów w p(cid:266)tli .......................................................................................... 302
Przesuwanie elementów po arkuszu ............................................................................. 305
Przekierowywanie na wybrany adres URL po up(cid:225)ywie okre(cid:286)lonego czasu .................. 308
Wci(cid:266)cie tekstu .............................................................................................................. 310
Odst(cid:266)p mi(cid:266)dzy liniami .................................................................................................. 312
Rozmiar czcionki .......................................................................................................... 313
Marginesy ..................................................................................................................... 317
Skorowidz .................................................................................... 321
Kup książkęPoleć książkę 6
JavaScript i jQuery. 131 praktycznych skryptów
Kup książkęPoleć książkę Rozdzia(cid:228) 9.
Zdarzenia
Zdarzenia dziel(cid:261) si(cid:266) na zdarzenia HTML i HTML DOM.
Zdarzenia HTML dotycz(cid:261) elementów HTML. Zdarzeniami s(cid:261) np.:
(cid:141) zako(cid:276)czenie (cid:225)adowania strony HTML,
(cid:141) zmiana zawarto(cid:286)ci pola do wpisywania danych,
(cid:141) klikni(cid:266)cie przycisku.
Zaj(cid:286)cie zdarzenia mo(cid:298)e by(cid:252) sygna(cid:225)em do rozpocz(cid:266)cia innej czynno(cid:286)ci, np. uruchomienia
funkcji. Funkcja nie zostanie wykonana przed wyst(cid:261)pieniem zdarzenia; np. dopóki
u(cid:298)ytkownik nie kliknie przycisku, dane nie zostan(cid:261) wczytane.
HTML DOM (ang. Document Object Model — model obiektów dokumentu) to standard
okre(cid:286)laj(cid:261)cy sposoby zmiany zawarto(cid:286)ci, w(cid:225)a(cid:286)ciwo(cid:286)ci i parametrów poszczególnych
elementów strony HTML.
Jakie jest zastosowanie obs(cid:225)ugi zdarze(cid:276)? Oto kilka przyk(cid:225)adów:
(cid:141) Uruchomienie programów, które powinny by(cid:252) wykonywane za ka(cid:298)dym
razem, gdy strona si(cid:266) za(cid:225)aduje.
(cid:141) Uruchomienie programów, które powinny by(cid:252) wykonywane za ka(cid:298)dym
razem, gdy strona jest zamykana.
(cid:141) Dzia(cid:225)ania, które powinny by(cid:252) wykonywane, gdy u(cid:298)ytkownik kliknie przycisk.
W tabeli 9.1 zebrano zdarzenia HTML DOM zwi(cid:261)zane z mysz(cid:261).
PRZYK(cid:227)AD 50.
Napisz program, który wy(cid:286)wietla na ekranie tekst Kliknij tekst!, za(cid:286) po wykonaniu
polecenia wy(cid:286)wietla podzi(cid:266)kowanie.
Kup książkęPoleć książkę 154
JavaScript i jQuery. 131 praktycznych skryptów
Tabela 9.1. Zdarzenia HTML DOM zwi(cid:261)zane z mysz(cid:261)
W(cid:228)a(cid:264)ciwo(cid:264)(cid:232)
onclick
ondblclick
onmousedown
onmouseenter
onmouseleave
onmousemove
onmouseover
onmouseout
onmouseup
Opis
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik kliknie element.
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik dwukrotnie kliknie element.
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik naci(cid:286)nie przycisk myszy, gdy kursor
znajduje si(cid:266) nad elementem.
Zdarzenie wyst(cid:266)puje, gdy kursor jest przesuwany na elemencie.
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik przesunie kursor z elementu.
Zdarzenie wyst(cid:266)puje, gdy kursor, b(cid:266)d(cid:261)c w ruchu, znajduje si(cid:266) nad elementem.
Zdarzenie wyst(cid:266)puje, gdy wska(cid:296)nik jest przesuwany na elemencie lub na jednym
z jego dzieci.
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik przesuwa wska(cid:296)nik myszy na element
lub z jednego z jego dzieci.
Zdarzenie wyst(cid:266)puje, gdy u(cid:298)ytkownik zwolni przycisk myszy na elemencie.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 050 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head body script
document.write( h1 050 /h1 );
/script
h1 onclick= this.innerHTML= Dzi(cid:250)kuj(cid:250)! Kliknij tekst! /h1
/body /html
Polecenie document.write( h1 050 /h1 ); zadeklarowane jest jako skrypt. Powoduje
ono wy(cid:286)wietlenie numeru przyk(cid:225)adu (rysunek 9.1).
Rysunek 9.1.
Okno z poleceniem
Polecenie:
h1 onclick= this.innerHTML= Dzi(cid:250)kuj(cid:250)! Kliknij tekst! /h1
sprawia, i(cid:298) wy(cid:286)wietlane jest polecenie Kliknij tekst!. Jest ono jednocze(cid:286)nie „czu(cid:225)e na klik-
ni(cid:266)cie”. Klikni(cid:266)cie go powoduje wy(cid:286)wietlenie okna z podzi(cid:266)kowaniem (rysunek 9.2).
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
Rysunek 9.2.
Okno
z podzi(cid:266)kowaniem
155
PRZYK(cid:227)AD 51.
Napisz program, który wy(cid:286)wietla na ekranie tekst Przesu(cid:276) kursor nad napis!, za(cid:286) po
wykonaniu polecenia wy(cid:286)wietlone zostaje podzi(cid:266)kowanie.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 051 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head body script
document.write( h1 051 /h1 );
/script
h1 onmouseenter= this.innerHTML= Dzi(cid:250)kuj(cid:250)! Przesu(cid:275) kursor nad napis! /h1
/body /html
Polecenie document.write( h1 051 /h1 ); zadeklarowane jest jako skrypt. Powoduje
ono wy(cid:286)wietlenie numeru przyk(cid:225)adu (rysunek 9.3).
Rysunek 9.3.
Okno z poleceniem
Polecenia:
h1 onmouseenter= this.innerHTML= Dzi(cid:250)kuj(cid:250)! Przesu(cid:275) kursor na napis! /h1
sprawiaj(cid:261), i(cid:298) wy(cid:286)wietlane jest polecenie Przesu(cid:276) kursor na napis!. Jest ono jednocze(cid:286)nie
„czu(cid:225)e na po(cid:225)o(cid:298)enie nad nim kursora”. Przesuni(cid:266)cie kursora nad napis powoduje, (cid:298)e
polecenie zostaje zast(cid:261)pione podzi(cid:266)kowaniem (rysunek 9.4).
Kup książkęPoleć książkę 156
JavaScript i jQuery. 131 praktycznych skryptów
Rysunek 9.4.
Okno
z podzi(cid:266)kowaniem.
Odsuni(cid:266)cie kursora
na puste pole nie
powoduje ponownego
wy(cid:286)wietlenia polecenia
PRZYK(cid:227)AD 52.
Napisz program, który wy(cid:286)wietla na ekranie tekst Przesu(cid:276) kursor nad prostok(cid:261)t!.
Umieszczony jest on w szarym prostok(cid:261)cie o wymiarach 200 (szeroko(cid:286)(cid:252)) na 20 pikseli
(wysoko(cid:286)(cid:252)). Po wykonaniu polecenia wy(cid:286)wietlony zostaje inny tekst. Przesuni(cid:266)cie kursora
z wn(cid:266)trza prostok(cid:261)ta powoduje ponowne wy(cid:286)wietlenie pro(cid:286)by.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 052 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head body script
document.write( h1 052 /h1 );
function mysz_nad(obj) {
obj.innerHTML = Widzisz, jakie czary!
}
function mysz_na_zewn(obj) {
obj.innerHTML = Przesu(cid:275) kursor nad prostok(cid:230)t!
}
/script
div onmouseover= mysz_nad(this) onmouseout= mysz_na_zewn(this)
style= background-color:#EEEEEE;width:200px;height:20px;padding:20px;
Przesu(cid:275) kursor nad prostok(cid:230)t! /div
/body /html
Polecenie document.write( h1 052 /h1 ); powoduje wy(cid:286)wietlenie numeru przyk(cid:225)adu
(rysunek 9.5).
Rysunek 9.5.
Wska(cid:296)nik myszy
znajduje si(cid:266) na prawo
od prostok(cid:261)ta
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
Polecenia:
157
div onmouseover= mysz_nad(this) onmouseout= mysz_na_zewn(this)
style= background-color:#EEEEEE;width:200px;height:20px;padding:20px;
Przesu(cid:275) kursor nad prostok(cid:230)t! /div
sprawiaj(cid:261), i(cid:298) wy(cid:286)wietlane jest polecenie Przesu(cid:276) kursor nad prostok(cid:261)t!. Jest ono jed-
nocze(cid:286)nie „czu(cid:225)e na po(cid:225)o(cid:298)enie nad nim kursora”. Przesuni(cid:266)cie kursora nad prostok(cid:261)t
powoduje, (cid:298)e polecenie zostaje zast(cid:261)pione podzi(cid:266)kowaniem (rysunek 9.6).
Rysunek 9.6.
Wska(cid:296)nik
nad prostok(cid:261)tem
Przesuni(cid:266)cie wska(cid:296)nika myszy na zewn(cid:261)trz prostok(cid:261)ta ponownie powoduje wy(cid:286)wie-
tlenie okna z pro(cid:286)b(cid:261) (rysunek 9.5).
Gdy wska(cid:296)nik myszy znajduje si(cid:266) na zewn(cid:261)trz prostok(cid:261)ta, wywo(cid:225)ywana jest funkcja:
function mysz_na_zewn(obj) {
obj.innerHTML = Przesu(cid:275) kursor nad prostok(cid:230)t!
}
Gdy wska(cid:296)nik myszy znajduje si(cid:266) wewn(cid:261)trz prostok(cid:261)ta, wywo(cid:225)ywana jest funkcja:
function mysz_nad(obj) {
obj.innerHTML = Widzisz, jakie czary!
}
W tabeli 9.2 zebrano zdarzenia HTML DOM zwi(cid:261)zane z klawiatur(cid:261).
Tabela 9.2. Zdarzenia HTML DOM zwi(cid:261)zane z klawiatur(cid:261)
Atrybut
onkeydown
onkeypress
onkeyup
Opis
Zdarzenie ma miejsce, gdy u(cid:298)ytkownik trzyma wci(cid:286)ni(cid:266)ty klawisz.
Zdarzenie wyst(cid:261)pi(cid:225)o, gdy u(cid:298)ytkownik nacisn(cid:261)(cid:225) klawisz.
Zdarzenie wyst(cid:261)pi(cid:225)o, gdy u(cid:298)ytkownik zwolni(cid:225) klawisz.
PRZYK(cid:227)AD 53.
Napisz program, który wy(cid:286)wietla na ekranie okno z polem do wpisania znaku. Wpisanie
kolejnego znaku powoduje zamian(cid:266) poprzednio wpisanej litery na wielk(cid:261).
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
Kup książkęPoleć książkę 158
JavaScript i jQuery. 131 praktycznych skryptów
http://www.w3.org/TR/html4/loose.dtd
head
title 053 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head body script
document.write( h1 053 /h1 );
function Funkcja()
{
var x=document.getElementById( znak );
x.value=x.value.toUpperCase();
}
/script
p Wpisanie kolejnego znaku powoduje zamian(cid:250) poprzednio wpisanej litery na
wielk(cid:230). /p
Wpisz numer rejestracyjny swojego samochodu: input type= text id= znak
onkeypress= Funkcja()
/body /html
Program sk(cid:225)ada si(cid:266) ze skryptu, w którym zdefiniowana jest funkcja, oraz wywo(cid:225)ania
funkcji.
Definicja funkcji ma posta(cid:252):
function Funkcja()
{
var x=document.getElementById( znak );
x.value=x.value.toUpperCase();
}
Znaki wpisane z klawiatury w polu formularza przypisywane s(cid:261) zmiennej x. Za kon-
wersj(cid:266) wielko(cid:286)ci liter odpowiedzialne jest polecenie toUpperCase.
Komentarz i miejsce, w którym pojawi si(cid:266) pole do wpisywania znaków, ustalone s(cid:261)
przez miejsce wpisania kodu:
Wpisz numer rejestracyjny swojego samochodu: input type= text id= znak
onkeypress= Funkcja()
Na rysunku 9.7 pokazano rezultat wykonania programu.
Rysunek 9.7.
Pierwszy znak
zosta(cid:225) zamieniony
na wielk(cid:261) liter(cid:266)
W tabeli 9.3 zebrano zdarzenia HTML DOM zwi(cid:261)zane z obiektami (ramkami).
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
159
Tabela 9.3. Zdarzenia HTML DOM zwi(cid:261)zane z obiektami (ramkami)
Atrybut
onabort
onerror
onload
onresize
onscroll
onunload
Opis
(cid:224)adowanie obrazu przerwano, zanim zosta(cid:225) za(cid:225)adowany w ca(cid:225)o(cid:286)ci.
Obraz nie zosta(cid:225) za(cid:225)adowany prawid(cid:225)owo (dla object , body i frameset ).
Dokument, frameset lub object zosta(cid:225) za(cid:225)adowany.
Zmieniono rozmiary widoku dokumentu.
Przewini(cid:266)to dokument.
Strona nie zosta(cid:225)a za(cid:225)adowana (ma zastosowanie zarówno dla body , jak i frameset ).
PRZYK(cid:227)AD 54.
Napisz program, który powoduje wy(cid:286)wietlenie wyskakuj(cid:261)cego okienka z komunika-
tem powitalnym. U(cid:298)ytkownik powinien nacisn(cid:261)(cid:252) klawisz OK, aby potwierdzi(cid:252) zapo-
znanie si(cid:266) z tre(cid:286)ci(cid:261) komunikatu.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 054 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head body onload= Funkcja() script
document.write( h1 054 /h1 );
function Funkcja()
{
alert( Witaj! );
}
/script
/body /html
W deklaracji sekcji body znajduje si(cid:266) polecenie onload= Funkcja(). Powoduje ono, (cid:298)e
po za(cid:225)adowaniu dokumentu wykonywana jest funkcja o nazwie Funkcja.
Co robi funkcja Funkcja? Jak mo(cid:298)na zorientowa(cid:252) si(cid:266) z kodu:
function Funkcja()
{
alert( Witaj! );
}
powoduje ona wy(cid:286)wietlenie okna z komunikatem Witaj!. Okno mo(cid:298)na zamkn(cid:261)(cid:252), kli-
kaj(cid:261)c przycisk OK lub krzy(cid:298)yk widoczny w prawym górnym rogu okna.
Na rysunku 9.8 pokazano fragment ekranu po za(cid:225)adowaniu pliku 054a.html.
Kup książkęPoleć książkę 160
JavaScript i jQuery. 131 praktycznych skryptów
Rysunek 9.8.
Okno z komunikatem
wy(cid:286)wietlanym
po za(cid:225)adowaniu
dokumentu HTML
W tabeli 9.4 zebrano zdarzenia HTML DOM zwi(cid:261)zane z formularzami.
Tabela 9.4. Zdarzenia HTML DOM zwi(cid:261)zane z formularzami
Atrybut
onblur
onchange
onfocus
onreset
onselect
onsubmit
Opis
Zdarzenie wyst(cid:266)puje, gdy element formularza traci fokus.
Zdarzenie wyst(cid:266)puje, gdy zawarto(cid:286)(cid:252) elementu formularza, selekcja lub sprawdzony
status uleg(cid:225)y zmianie (ma zastosowanie do input , select oraz textarea ).
Zdarzenie wyst(cid:266)puje, gdy element uzyskuje fokus (ma zastosowanie dla label ,
input , select , textarea oraz button ).
Zdarzenie wyst(cid:266)puje, gdy formularz jest resetowany.
Zdarzenie nast(cid:261)pi, gdy u(cid:298)ytkownik wybierze tekst (ma zastosowanie dla input
and textarea ).
Zdarzenie nast(cid:261)pi, gdy formularz zostanie wys(cid:225)any.
Cz(cid:225)owiek pos(cid:225)uguje si(cid:266) literami i liczbami. Komputer u(cid:298)ywa tylko liczb. Napiszemy
program, który pojedyncze znaki alfanumeryczne b(cid:266)dzie zamienia(cid:225) na odpowiedniki
Unicode.
PRZYK(cid:227)AD 55.
Napisz program, który wy(cid:286)wietli okno do wpisania znaku. Konwersja na odpowiednik
Unicode zostanie wykonana, gdy kursor znajdzie si(cid:266) na zewn(cid:261)trz pola.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 055 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head
body script
document.write( h1 055 /h1 br 1. Wpisz znak w polu. br 2. Kliknij na zewn(cid:230)trz
(cid:180)pola. br 3. Odczytaj odpowiednik Unicode. br );
function konwersja() {
var kod = document.getElementById( znak );
kod.value = kod.value.charCodeAt();
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
161
}
/script
Wpisz znak: input type= text id= znak onblur= konwersja()
/body /html
Polecenia:
document.write( h1 055 /h1 br 1. Wpisz znak w polu. br 2. Kliknij na zewn(cid:230)trz
(cid:180)pola. br 3. Odczytaj odpowiednik Unicode. br );
powoduj(cid:261) wy(cid:286)wietlenie na ekranie tytu(cid:225)u strony oraz uj(cid:266)tej w trzech punktach informacji
o dzia(cid:225)aniu programu.
Przedostatnia linijka programu:
Wpisz znak: input type= text id= znak onblur= konwersja()
powoduje wy(cid:286)wietlenie pola. Polecenie onblur powoduje, (cid:298)e gdy kursor znajdzie si(cid:266)
na zewn(cid:261)trz pola, wywo(cid:225)ana zostaje funkcja konwersja. Ma ona nast(cid:266)puj(cid:261)c(cid:261) posta(cid:252):
function konwersja() {
var kod = document.getElementById( znak );
kod.value = kod.value.charCodeAt();
}
Jej zadaniem jest zamiana zmiennej znak na odpowiednik Unicode.
Po wykonaniu konwersji wpisany znak zostaje zast(cid:261)piony przez jego odpowiednik.
Na rysunku 9.9 pokazano okno przegl(cid:261)darki po wczytaniu pliku 055a.html. Na rysun-
ku 9.10 pokazano okno przegl(cid:261)darki po wpisaniu litery a i klikni(cid:266)ciu pola obok.
Rysunek 9.9.
Okno
po za(cid:225)adowaniu
pliku
Rysunek 9.10.
Literze a odpowiada
kod Unicode 97
Kup książkęPoleć książkę 162
JavaScript i jQuery. 131 praktycznych skryptów
W tabeli 9.5 zebrano zdarzenia HTML DOM zwi(cid:261)zane z w(cid:225)a(cid:286)ciwo(cid:286)ciami.
Tabela 9.5. Zdarzenia HTML DOM zwi(cid:261)zane z w(cid:225)a(cid:286)ciwo(cid:286)ciami
W(cid:228)a(cid:264)ciwo(cid:264)(cid:232)
bubbles
cancelable
currentTarget
eventPhase
target
timeStamp
type
Opis
Zwraca informacj(cid:266), czy zdarzenie mo(cid:298)e przechodzi(cid:252) faz(cid:266) propagacji
(tzw. b(cid:261)belkowanie).
Zwraca informacj(cid:266), czy zdarzenie mo(cid:298)e mie(cid:252) zablokowane dzia(cid:225)anie w sposób
domy(cid:286)lny.
Zwraca element, którego s(cid:225)uchacz zdarze(cid:276) wywo(cid:225)a(cid:225) zdarzenie.
Zwraca informacj(cid:266), która faza przep(cid:225)ywu zdarze(cid:276) jest obecnie oceniana.
Zwraca element, który wywo(cid:225)a(cid:225) zdarzenie.
Zwraca czas mierzony w milisekundach w stosunku do momentu, w którym
zdarzenie zosta(cid:225)o utworzone.
Zwraca nazw(cid:266) zdarzenia.
B(cid:241)belkowanie to odpowiadanie na zdarzenia w trakcie ich propagacji od obiektu
docelowego do obiektów zewn(cid:246)trznych.
PRZYK(cid:227)AD 56.
Napisz program, który po klikni(cid:266)ciu wy(cid:286)wietli w wyskakuj(cid:261)cym oknie liczony w mi-
lisekundach czas, który up(cid:225)yn(cid:261)(cid:225) od zdefiniowania zdarzenia.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 056 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head
body onmousedown= getEventType(event)
script
document.write( h1 056 /h1 );
function stoper(zdarzenie)
{
alert(zdarzenie.timeStamp);
}
/script
p onclick= stoper(event) Kliknij akapit, a wy(cid:295)wietlone zostanie okno z mierzonym
(cid:180)w milisekundach czasem, który up(cid:273)yn(cid:230)(cid:273) od utworzenia zdarzenia. /p
/body /html
Wy(cid:286)wietlanie informacji inicjowane jest przez wci(cid:286)ni(cid:266)cie klawisza myszy. Zdarzenie
zosta(cid:225)o powi(cid:261)zane z pomiarem czasu w linii:
body onmousedown= getEventType(event)
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
163
Akapit reaguje na klikni(cid:266)cie, poniewa(cid:298) w jego definicji umieszczony jest kod:
p onclick= stoper(event)
Funkcja, która powoduje wy(cid:286)wietlenie okna z wynikiem, ma posta(cid:252):
function stoper(zdarzenie)
{
alert(zdarzenie.timeStamp);
}
Na rysunku 9.11 pokazano okno przegl(cid:261)darki z wynikiem pomiaru.
Rysunek 9.11.
Wynik wy(cid:286)wietlony
po klikni(cid:266)ciu akapitu
W tabeli 9.6 zebrano zdarzenia MouseEvent/KeyboardEvent HTML DOM zwi(cid:261)zane
z w(cid:225)a(cid:286)ciwo(cid:286)ciami.
Tabela 9.6. Zdarzenia MouseEvent/KeyboardEvent HTML DOM zwi(cid:261)zane z w(cid:225)a(cid:286)ciwo(cid:286)ciami
W(cid:228)a(cid:264)ciwo(cid:264)(cid:232)
altKey
button
clientX
clientY
ctrlKey
keyIdentifier
keyLocation
metaKey
relatedTarget
screenX
screenY
shiftKey
Opis
Zwraca informacj(cid:266), czy klawisz Alt zosta(cid:225) wci(cid:286)ni(cid:266)ty, gdy zdarzenie zosta(cid:225)o
zarejestrowane.
Zwraca informacj(cid:266), który klawisz myszy zosta(cid:225) klikni(cid:266)ty, gdy zdarzenie zosta(cid:225)o
zarejestrowane.
Zwraca wspó(cid:225)rz(cid:266)dn(cid:261) poziom(cid:261) wska(cid:296)nika myszy w stosunku do bie(cid:298)(cid:261)cego okna,
gdy zdarzenie zosta(cid:225)o zarejestrowane.
Zwraca wspó(cid:225)rz(cid:266)dn(cid:261) pionow(cid:261) wska(cid:296)nika myszy w stosunku do bie(cid:298)(cid:261)cego okna,
gdy zdarzenie zosta(cid:225)o zarejestrowane.
Zwraca informacj(cid:266), czy klawisz Ctrl zosta(cid:225) wci(cid:286)ni(cid:266)ty, gdy zdarzenie zosta(cid:225)o
zarejestrowane.
Zwraca identyfikator klawisza.
Zwraca po(cid:225)o(cid:298)enie klawisza w urz(cid:261)dzeniu.
Zwraca informacj(cid:266), czy klawisz meta zosta(cid:225) wci(cid:286)ni(cid:266)ty, gdy zdarzenie zosta(cid:225)o
zarejestrowane.
Zwraca element zwi(cid:261)zany z elementem, który spowodowa(cid:225) zdarzenie.
Zwraca wspó(cid:225)rz(cid:266)dn(cid:261) poziom(cid:261) wska(cid:296)nika myszy w stosunku do ekranu,
gdy zdarzenie zosta(cid:225)o zarejestrowane.
Zwraca wspó(cid:225)rz(cid:266)dn(cid:261) pionow(cid:261) wska(cid:296)nika myszy w stosunku do ekranu,
gdy zdarzenie zosta(cid:225)o zarejestrowane.
Zwraca informacj(cid:266), czy klawisz Shift zosta(cid:225) wci(cid:286)ni(cid:266)ty, gdy zdarzenie zosta(cid:225)o
zarejestrowane.
Kup książkęPoleć książkę 164
JavaScript i jQuery. 131 praktycznych skryptów
PRZYK(cid:227)AD 57.
Napisz program, który po klikni(cid:266)ciu tekstu wy(cid:286)wietli wspó(cid:225)rz(cid:266)dne klikni(cid:266)tego miejsca
w stosunku do bie(cid:298)(cid:261)cego okna.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 057 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head
body
script
document.write( h1 057 /h1 );
function wspolrzedne_kursora(event)
{
var x=event.clientX
var y=event.clientY
alert( Wspó(cid:273)rz(cid:250)dna X: + x + , wspó(cid:273)rz(cid:250)dna Y: + y)
/script
p onmousedown= wspolrzedne_kursora(event) Kliknij akapit, a wy(cid:295)wietlone zostanie
(cid:180)okno ze wspó(cid:273)rz(cid:250)dnymi X i Y kursora. Kliknij akapit, a wy(cid:295)wietlone zostanie okno
(cid:180)ze wspó(cid:273)rz(cid:250)dnymi X i Y kursora. Kliknij akapit, a wy(cid:295)wietlone zostanie okno ze
(cid:180)wspó(cid:273)rz(cid:250)dnymi X i Y kursora. Kliknij akapit, a wy(cid:295)wietlone zostanie okno ze
(cid:180)wspó(cid:273)rz(cid:250)dnymi X i Y kursora. Kliknij akapit, a wy(cid:295)wietlone zostanie okno ze
(cid:180)wspó(cid:273)rz(cid:250)dnymi X i Y kursora. Kliknij akapit, a wy(cid:295)wietlone zostanie okno ze
(cid:180)wspó(cid:273)rz(cid:250)dnymi X i Y kursora. /p
/body /html
Funkcja, która odczytuje i wy(cid:286)wietla wspó(cid:225)rz(cid:266)dne kursora w chwili klikni(cid:266)cia tekstu,
ma posta(cid:252):
function wspolrzedne_kursora(event)
{
var x=event.clientX
var y=event.clientY
alert( Wspó(cid:273)rz(cid:250)dna X : + x + , Y Wspó(cid:273)rz(cid:250)dna : + y)
}
Akapit, który jest „wra(cid:298)liwy na klikni(cid:266)cie”, rozpoczyna si(cid:266) od fragmentu:
p onmousedown= wspolrzedne_kursora(event) Kliknij akapit…
Na rysunku 9.12 pokazano okno przegl(cid:261)darki z wynikiem pomiaru.
Obiekt Anchor reprezentuje element a j(cid:246)zyka HTML.
Kup książkęPoleć książkę Rozdzia(cid:228) 9. (cid:105) Zdarzenia
Rysunek 9.12.
Po klikni(cid:266)ciu akapitu
wy(cid:286)wietlone zosta(cid:225)y
wspó(cid:225)rz(cid:266)dne kursora
w stosunku do
bie(cid:298)(cid:261)cego okna
165
W tabeli 9.7 zebrano w(cid:225)a(cid:286)ciwo(cid:286)ci obiektu Anchor HTML DOM.
Tabela 9.7. W(cid:225)a(cid:286)ciwo(cid:286)ci obiektu Anchor HTML DOM
W(cid:228)a(cid:264)ciwo(cid:264)(cid:232)
charset
download
hash
host
hostname
href
hreflang
origin
id
name
password
pathname
port
protocol
rel
rev
search
target
text
type
username
Opis
Nie jest obs(cid:225)ugiwana w HTML 5. Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu charset linku.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu download linku.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu href linku.
Ustawia lub zwraca nazw(cid:266) hosta i portu atrybutu href.
Ustawia lub zwraca nazw(cid:266) hosta atrybutu href.
Ustawia lub zwraca atrybut href linku.
Ustawia lub zwraca atrybut hreflang linku.
Zwraca protokó(cid:225), nazw(cid:266) hosta i portu atrybutu href.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu id linku.
Nie jest obs(cid:225)ugiwana w HTML5. Zamiast niej nale(cid:298)y u(cid:298)ywa(cid:252) id. Ustawia lub
zwraca warto(cid:286)(cid:252) atrybutu id linku.
Ustawia lub zwraca cz(cid:266)(cid:286)(cid:252) password warto(cid:286)ci atrybutu href.
Ustawia lub zwraca nazw(cid:266) (cid:286)cie(cid:298)ki dost(cid:266)pu warto(cid:286)ci atrybutu href.
Ustawia lub zwraca nazw(cid:266) portu z warto(cid:286)ci atrybutu href.
Ustawia lub zwraca nazw(cid:266) protoko(cid:225)u linku.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu rel linku.
Nie jest obs(cid:225)ugiwana w HTML 5. Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu rev linku.
Ustawia lub zwraca cz(cid:266)(cid:286)(cid:252) atrybutu href, która jest ci(cid:261)giem kwerendy.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu target zawart(cid:261) w linku.
Ustawia lub zwraca tekst zawarty w linku.
Ustawia lub zwraca warto(cid:286)(cid:252) atrybutu type zawart(cid:261) w linku.
Ustawia lub zwraca nazw(cid:266) u(cid:298)ytkownika zawart(cid:261) w atrybucie href.
Kup książkęPoleć książkę 166
JavaScript i jQuery. 131 praktycznych skryptów
PRZYK(cid:227)AD 58.
Napisz program, który po klikni(cid:266)ciu przycisku wy(cid:286)wietli zapytanie zawarte w linku.
Program, który spe(cid:225)nia postawione za(cid:225)o(cid:298)enia, wygl(cid:261)da nast(cid:266)puj(cid:261)co:
!DOCTYPE HTML PUBLIC
-//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd
head
title 058 /title
meta http-equiv= CONTENT-LANGUAGE CONTENT= PL
meta http-equiv= content-type CONTENT= text/html; CHARSET=iso-8859-2
meta http-equiv= Content-Script-Type content= text/javascript
/head
h1 058 /h1
p a id= yyy
href= http://helion.pl/search?qa= szukaj=wrotek sortby=wd serwisyall=1 wsprzed=
(cid:180)1 wprzyg=1 sent=1 Link /a /p
p Kliknij przycisk, aby wy(cid:295)wietli(cid:232) cz(cid:250)(cid:295)(cid:232) ci(cid:230)gu kwerendy z linku powy(cid:318)ej. /p
button onclick= funkcja() Kliknij /button
p id= xxx /p
script
function funkcja() {
var x = document.getElementById( yyy ).search;
document.getElementById( xxx ).innerHTML = x;
}
/script
/body
/html
Link ma posta(cid:252):
http://helion.pl/search?qa= szukaj=wrotek sortby=wd serwisyall=1 wsprzed=1 wprzyg=
(cid:180)1 sent=1
Jest to zapytanie do bazy danych. Tre(cid:286)(cid:252) zapytania znajduje si(cid:266) po znaku zapytania.
Sygna(cid:225)em do wydzielenia z linku tre(cid:286)ci zapytania jest klikni(cid:266)cie przycisku. Przycisk
i zwi(cid:261)zana z nim funkcja s(cid:261) wy(cid:286)wietlane dzi(cid:266)ki linijce:
button onclick= funkcja() Kliknij /button
Konieczne jest jeszcze zdefiniowanie funkcji uruchamianej klikni(cid:266)ciem przycisku:
function funkcja() {
var x = document.getElementById( yyy ).search;
document.getElementById( xxx ).innerHTML = x;
}
Na rysunku 9.13 pokazano okno przegl(cid:261)darki po za(cid:225)adowaniu pliku 058a.html. Na ry-
sunku 9.14 pokazano okno przegl(cid:261)darki po klikni(cid:266)ciu przycisku.
Kup książkęPoleć książkę 167
Rozdzia(cid:228) 9. (cid:105) Zdarzenia
Rysunek 9.13.
Dokument HTML
po za(cid:225)adowaniu
Rysunek 9.14.
Pod przyciskiem
widoczna tre(cid:286)(cid:252)
zapytania zawarta
w linku
Kup książkęPoleć książkę 168
JavaScript i jQuery. 131 praktycznych skryptów
Kup książkęPoleć książkę Skorowidz
-, 31
--, 31
, 141
!, 45
!=, 41
, 141
$, 169
, 31
=, 35
, 45
*, 31
*/, 20
*=, 35
.attr, 239
/, 31
/*, 20
//, 20
/=, 35
\, 141
{, 72
||, 45
}, 72
+, 31
++, 31
+=, 35
, 41
=, 41
=, 35
-=, 35
==, 41
===, 41, 42
, 41
=, 41
(cid:154), 134
0, 112
0,1, 125
0,2, 125
0,3, 125
0x, 126
1, 112
1em, 315
A
abs, 121
acos, 121
adres
pliku, 72
strony WWW wy(cid:286)wietlony
w oknie komunikatu, 239
after, 248
akapitu usuwanie, 210
alert, 57, 212
Alt wci(cid:286)ni(cid:266)ty, 163
altKey, 163
Anchor, 165
animacja, 284, 289, 303
w p(cid:266)tli, 302
animate, 282, 284, 289, 293
append, 242, 246
arcus
cosinus, 121
sinus, 121
tangens, 121
tangens ilorazu, 121
argument jest liczb(cid:261), 57
arkusze stylów CSS, 25, 207, 259
Array, 93
ASCII, 86
asin, 121
atan, 121
atan2, 121
attr, 239
B
b, 141
backslash, 26, 141
backspace, 141
b(cid:261)belkowanie, 162
before, 248
bia(cid:225)e spacje, 142
Kup książkęPoleć książkę JavaScript i jQuery. 131 praktycznych skryptów
przed elementem ju(cid:298) istniej(cid:261)cym elementu
za elementem ju(cid:298) istniej(cid:261)cym elementu
Date, 115, 117, 118
dblclick, 209, 210
decodeURI(), 57
Component(), 57
definicja stylu, 25
deklaracja zmiennej, 27
dekodowanie, 58
dekrementacja, 31
delegate, 226
development version, 14
d(cid:225)ugo(cid:286)ci ci(cid:261)gu, 143
document.write, 19, 23
dodanie
nowego, 244
nowego, 242
dodawanie, 31
Dojo, 9
dok(cid:225)adno(cid:286)(cid:252), 125
oblicze(cid:276), 40
Dokument zosta(cid:225) za(cid:225)adowany, 159
DOM, 153, 233
domy(cid:286)lnie zaznaczone, 225
do-while, 86
download, 165
dwójkowa liczba, 127
dwukrotne klikni(cid:266)cie, 154, 210
dzia(cid:225)ania na zmiennych, 35
dzielenie, 31
przez 0, 37, 128
dzie(cid:276)
miesi(cid:261)ca, 118
tygodnia, 118
dziesi(cid:266)tna liczba, 127
E
E, 120
element
322
biblioteka, 8
binarna liczba, 127
bind, 222
blur, 220
Boolean, 111
bubbles, 162
button, 163
C
callback, 282
cancelable, 162
ceil, 121
Celsjusz, 39
charAt, 142
charCodeAt, 142
charset, 165
click, 207, 230, 241
clientX, 163
clientY, 163
concat, 107, 142
constructor, 142
content, 116
cos, 121
cosinus, 121
CSS, 259
Ctrl wci(cid:286)ni(cid:266)ty, 163
ctrlKey, 163
cudzys(cid:225)ów, 26, 140
podwójny, 141
pojedynczy, 141
currentTarget, 162
czas
utworzone, 162
pojawiania si(cid:266), 273
zanikania, 273
(cid:298)ycia zmiennej, 52
czcionka
czcionka
kolor, 24
pogrubiona, 24
rozmiar, 313
zmiana, 186
dane
237
data
jako ci(cid:261)g znaków
JSON, 119
ISO, 119
systemowa, 64, 115
D
jako ci(cid:261)g znaków, 119
lokalny, 118
od momentu, w którym zdarzenie zosta(cid:225)o
predefiniowane, 197
z formularza wy(cid:286)wietlone w oknie komunikatu,
eval(), 57
event
animowany, 284
bie(cid:298)(cid:261)cy, 177
który wywo(cid:225)a(cid:225) zdarzenie, 162
wst(cid:266)pnie wybrany, 200
zwi(cid:261)zany z elementem, który spowodowa(cid:225)
zdarzenie, 163
empty, 252
encodeURI(), 57
Component(), 57
.data, 231
Phase, 162
Ex, 121
exp, 121
Kup książkęPoleć książkę Skorowidz
323
F
H
f, 141
fade
In, 273
Out, 273
Toggle, 275
Fahrenheit, 39
false, 44, 112
fa(cid:225)sz, 44, 112
faza
floor, 121
focus, 160, 220
font-size, 315
for, 90
format
liczbowy, 41
tekstowy, 41
propagacji, 162
przep(cid:225)ywu zdarze(cid:276), 162
formatowanie arkuszami stylów CSS, 263
formularz, 160
dane predefiniowane, 197
warto(cid:286)(cid:252) pola, 237
framework, 8
fromCharCode, 142
FullYear, 118
function, 47
funkcja, 47
G
get
Date, 118
Day, 118
FullYear, 118, 119
Hours, 118
Milliseconds, 118
Minutes, 118
Month, 118
Month(), 79
Seconds, 118
Time, 118
TimezoneOffset, 118, 120
UTCDate, 118
UTCDay, 118
UTCFullYear, 118
UTCHours, 118
UTCMilliseconds, 118
UTCMinutes, 118
UTCMonth, 118
UTCSeconds, 118
Year, 118
godzina, 118
hash, 165
head, 116
height, 269
heksadecymalna liczba, 127
hide, 184, 210
host, 165
name, 165
hover, 218
href, 165
lang, 165
HTML, 7, 153, 235
DOM, 153
szablon strony, 10
I
id, 165
idealnie równe, 41
identyczne, 42
identyfikator klawisza, 163
if, 72
… else, 76
iloczyn logiczny, 45
indexOf, 142
infinity, 38, 59, 128
informacja o niewybraniu pliku, 195
inkrementacja, 31, 34
instrukcja wykonana co najmniej jeden raz, 86
interlinia, 312
is
Finite(), 57
NaN(), 57
J
JavaQuery, 169
JavaScript, 7
szablon strony, 10
j(cid:266)zyk skryptowy, 8
jQuery, 9
Migrate, 239
szablon strony, 12
zalety, 9
zapisane na dysku, 14
zewn(cid:266)trzne, 13
K
kapitaliki, 24
key
Identifier, 163
Location, 163
klawisz
meta wci(cid:286)ni(cid:266)ty, 163
myszy zosta(cid:225) klikni(cid:266)ty, 163
Kup książkęPoleć książkę 324
JavaScript i jQuery. 131 praktycznych skryptów
klikni(cid:266)cie, 154
lub dwukrotne klikni(cid:266)cie, 222
klonowanie akapitu, 226
kod
wykonany, je(cid:298)eli warunek jest prawdziwy, 71
znaku znajduj(cid:261)cego si(cid:266) na pozycji n w stringu, 142
kodowanie, 58
kolejka, 104
kolejno(cid:286)(cid:252)
dzia(cid:225)a(cid:276), 31
elementów, 107
komentarz, 20
komórki
zliczanie, 67
konwersja
argumentu na liczb(cid:266), 57
czasu na ci(cid:261)g, 119
na dat(cid:266), 119
obiekt Date na ci(cid:261)g, 119
Unicode na znaki, 142
warto(cid:286)ci obiektu na ci(cid:261)g, 57
znaku na odpowiednik Unicode, 160
kroki zmiennej, 91
kursor
nad elementem, 154
przesuni(cid:266)ty z elementu, 154
przesuwany na elemencie, 154
przesuwany nad elementem lub jednym
z jego dzieci, 154
L, (cid:227)
lastIndexOf, 142
length, 63, 142
liczba
bardzo
du(cid:298)a, 124
ma(cid:225)a, 124
ca(cid:225)kowita, 57
dwójkowa, 127
dziesi(cid:266)tna, 127
Eulera, 120
jako ci(cid:261)g, 132
losowa, 121
milisekund od
1 stycznia 1970 00:00:00, 118
pó(cid:225)nocy 1 stycznia 1970 roku wed(cid:225)ug czasu
UTC, 119
o okre(cid:286)lonej d(cid:225)ugo(cid:286)ci, 132
ósemkowa, 127
porównywanie, 113
szesnastkowa, 126
zaokr(cid:261)glona i zapisana przy u(cid:298)yciu
notacji wyk(cid:225)adniczej, 132
okre(cid:286)lonej liczby miejsc po przecinku, 132
zapis, 123
zmiennoprzecinkowa podwójnej precyzji, 125
link graficzny, 47
lista rozwijana, 200
LN10, 120
LN2, 120
localeCompare, 142
log, 121
LOG10E, 120
LOG2E, 120
logarytm
naturalny z 10, 120
naturalny z 2, 120
naturalny, 121
o podstawie 10 z E, 120
o podstawie 2 z E, 120
losowa zmiana, 304
(cid:225)adowanie obrazu przerwano, 159
(cid:225)a(cid:276)cuch polece(cid:276), 300
(cid:225)(cid:261)czenie
ci(cid:261)gów znaków, 142, 148
tablic, 107
tekstów, 32
M
marginesy wokó(cid:225) akapitów, 317
maskowanie pól, 199
match, 142
Math, 120
.round, 40
max, 121
MAX_VALUE, 129
metaKey, 163
metoda, 61, 117
miesi(cid:261)c, 118
z daty systemowej, 78
milisekundy, 118
od pó(cid:225)nocy 1 stycznia 1970, 118
min, 121
MIN_VALUE, 129
minus niesko(cid:276)czono(cid:286)(cid:252), 129
minuty, 118
mniejsze, 41
lub równe, 41
mno(cid:298)enie, 31
modulo, 31, 32
Moo Tools, 9
mouse
down, 215
enter, 212, 218
leave, 214, 218
up, 217
N
n, 141
naci(cid:286)ni(cid:266)ty klawisz, 157
nadanie zmiennej warto(cid:286)ci tekstowej, 37
Kup książkęPoleć książkę Skorowidz
325
najmniejsza liczba, 121, 129
najwi(cid:266)ksza liczba, 121, 129
name, 165
NaN, 129
nazwa
hosta, 165
u(cid:298)ytkownika, 165
zdarzenia, 162
zmiennej, 28
NEGATIVE_INFINITY, 129
new
Array(), 64
Boolean(), 64
Date(), 64
Function(), 64
Number(), 64
Object(), 64
RegExp(), 64
String(), 64
nie jest równe, 41
noscript, 17
notacja naukowa, 124
Not-a-Number, 129
nowa linia, 141
nowy obiekt, 64, 68
typu
ci(cid:261)g, 64
data, 64
funkcja, 64
liczba, 64
logicznego, 64
tablica, 64
Number, 123, 129, 130, 132
number(), 57
numer pozycji, na której znajduje si(cid:266)
ostatni znak (cid:225)a(cid:276)cucha, 142
pierwszy znak (cid:225)a(cid:276)cucha, 142
O, Ó
obiekt, 61
typu
ci(cid:261)g, 64
data, 64
funkcja, 64
liczba, 64
logicznego, 64
tablica, 64
obiektowy model dokumentu, 233
obraz
nie zosta(cid:225) za(cid:225)adowany prawid(cid:225)owo, 159
w powi(cid:266)kszeniu, 269
zmiana wymiarów, 285
odejmowanie, 31
odst(cid:266)p od kraw(cid:266)dzi obrazka, 271
odsy(cid:225)acz, 26
od(cid:286)wie(cid:298)enie okna przegl(cid:261)darki, 116
odwo(cid:225)anie do
funkcji, 49
komórki, 65
odwracanie kolejno(cid:286)ci elementów, 107
odwrotno(cid:286)(cid:252) liczby, 29
okno dialogowe, 57
oktalna liczba, 127
on
abort, 159
blur, 160
change, 160
click, 154
dblclick, 154
error, 159
focus, 160
keydown, 157
keypress, 157
load, 159
mouse
down, 154
enter, 154
leave, 154
move, 154
out, 154
over, 154
up, 154
reset, 160
resize, 159
scroll, 159
select, 160
submit, 160
unload, 159
opacity, 291, 303
operator
arytmetyczny, 30
identyczno(cid:286)ci, 42
logiczny, 44
porównania, 41
przypisania, 35
warunkowy, 80
operowanie dat(cid:261), 117
origin, 165
ósemkowa liczba, 127
P
p, 210, 214
params, 282
parse, 118
Float, 57, 130
Int, 57, 130
password, 165, 188
pathname, 165
p(cid:266)tla, 96,
w p(cid:266)tli, 103
Pi, 120
pierwiastek kwadratowy, 120, 121
Kup książkęPoleć książkę 326
JavaScript i jQuery. 131 praktycznych skryptów
pierwotna warto(cid:286)(cid:252) obiektu, 132
String, 142
plus niesko(cid:276)czono(cid:286)(cid:252), 129
p(cid:225)ynne
pojawiania si(cid:266) elementów, 273
ukrywanie elementu, 273
pobieranie znaków z ci(cid:261)gu, 149
podzielno(cid:286)(cid:252) liczby, 80
pole
do wpisywania has(cid:225)a, 188
wyboru, 191
wyró(cid:298)nione domy(cid:286)lnie, 202
po(cid:225)o(cid:298)enie klawisza w urz(cid:261)dzeniu, 163
porównanie
liczb, 113
stringów, 142
port, 165
position, 282
POSITIVE_INFINITY, 129
pot(cid:266)gowanie, 121
pow, 121
powrót karetki, 141
powtarzanie operacji, 81
pozycja znaku w (cid:225)a(cid:276)cuchu, 142
prawda, 44, 112
prepend, 244
production version, 14
prompt, 57, 114
prop, 239, 240, 241
protocol, 165
protokó(cid:225), 165
prototype, 9, 142
przegl(cid:261)darka nie obs(cid:225)uguje JavaScript, 17
przekazywanie warto(cid:286)ci mi(cid:266)dzy funkcjami, 52
przekszta(cid:225)canie zmiennych w liczby, 130
przesuni(cid:266)cie
elementów w dó(cid:225), 279
kursora
nad obszar, 156
z akapitu, 213
kursora z obszaru, 218
obrazka klikaniem przycisków, 305
strefy czasowej, 119
przeszukanie
ci(cid:261)gu, 144
stringów, 142
przewini(cid:266)to dokument, 159
przezroczysto(cid:286)(cid:252), 303
obrazka, 289
R
r, 141
random, 121, 305
ready, 212
referencja, 134
refresh, 116
rekord, 62
rel, 165
relatedTarget, 163
remove, 250
replace, 142
reprezentacja zmiennoprzecinkowa, 125
rev, 165
reverse, 107
rok, 118
round, 121
rozmiar czcionki, 313
równe, 41, 42
S, (cid:263)
Screen
X, 163
Y, 163
search, 142, 165
sekundy, 118
selected, 201, 225
selektor, 179
globalny, 175
set
Date, 118
FullYear, 118
Hours, 118
Milliseconds, 118
Minutes, 118
Month, 118
Seconds, 118
Time, 118
UTC
Date, 118
FullYear, 118
Hours, 118
Milliseconds, 118
Minutes, 118
Month, 118
Seconds, 119
Year, 119
shift, 105
Key, 163
wci(cid:286)ni(cid:266)ty, 163
show, 184
sin, 121
sinus, 121
skrypt
osadzony, 11, 18
wy(cid:225)(cid:261)czona obs(cid:225)uga, 17
zewn(cid:266)trzny, 11, 18
slice, 142, 145
slide
Down, 279
Toggle, 280
Up, 284
s(cid:225)owa oddzielone spacjami, 58
s(cid:225)uchacz zdarze(cid:276), 162
speed, 282
Kup książkęPoleć książkę Skorowidz
spe(cid:225)nienie warunku, 71
split, 142
sqrt, 120, 121
string, 57, 63, 139, 140, 142
Strona nie zosta(cid:225)a za(cid:225)adowana, 159
substr, 142
substring, 142
suma logiczna, 45
sumowanie liczb, 50
switch, 78
szary obrazek t(cid:225)a, 194
szesnastkowa liczba, 126, 127
(cid:286)cie(cid:298)ka dost(cid:266)pu, 165
T
t, 141
tabela
sortowanie, 100
tablica, 64, 91, 93, 150
adresowanie
liczbowe, 98
przez nazw(cid:266), 98
dopisywanie danych, 66
dwuwymiarowa, 102
(cid:225)(cid:261)czenie, 107
rozmiar, 96
usuwanie danych, 99
tabulator, 141
tan, 121
tangens, 121
target, 162, 165
tekst
akapitowy, 25
(cid:225)(cid:261)czenie, 32
odst(cid:266)py pomi(cid:266)dzy wyrazami, 294
powi(cid:266)kszenie, 293
ukrywanie, 250
wraz ze znacznikami HTML, 235
wy(cid:286)wietlanie, 250
z podzia(cid:225)em na akapity, 23
zawarty w linku, 165
temperatura, zamiana skali, 39
text, 165, 188, 233
this, 177
timeStamp, 162
t(cid:225)o
dodawanie, 257
pola wyboru, 191
przycisków
radiowych, 190
do wysy(cid:225)ania danych, 192
usuwanie, 257
to
DateString, 119
Exponential, 132
Fixed, 132
GMTString, 119
327
ISOString, 119
JSON, 119
Locale
DateString, 119
LowerCase, 142
String, 119
TimeString, 119
UpperCase, 142
LowerCase, 142
Precision, 132
String, 119, 127, 132, 142
TimeString, 119
UpperCase, 142
UTCString, 119
trim, 142
true, 44, 112
typ zmiennej, 28, 139
type, 162, 165
typeof, 139
U
ukrycie
elementu o okre(cid:286)lonym id, 172
fragmentów strony, 170
odsy(cid:225)aczy, 184
tekstu, 250
umieszczenie kursora w polu, 220
undefined, 36
Unicode, 161
unshift, 105
URI, 57, 59
URL, 59
URN, 59
uruchamianie
wielu polece(cid:276) jQuery, 300
skryptu po klikni(cid:266)ciu linku, 206
username, 165
ustalenie znaku, 31
ustawianie
daty liczb(cid:261) milisekund
przed/po 1 stycznia 1970, 118
dnia miesi(cid:261)ca, 118
godziny, 118
miesi(cid:261)ca, 118
milisekund, 118
minut, 118
roku, 118
sekund, 118, 119
usuwanie elementów
podrz(cid:266)dnych., 252
z dokumentu HTML, 250
ze strony, 179
usuwanie pierwszej pozycji z listy, 180
UTC, 118, 119
utrata fokusu, 160
uzyskanie fokusu, 160
Kup książkęPoleć książkę 328
JavaScript i jQuery. 131 praktycznych skryptów
val, 237
value, 238
Of, 119, 132, 142
Verdana, 24
V
W
warto(cid:286)(cid:252)
bezwzgl(cid:266)dna, 121
logiczna, 112
szesnastkowa, 126
zmiennej, 29, 36
zmiennoprzecinkowa, 57, 60
warunek, 74
nie zostanie spe(cid:225)niony, 76
sprawdzany na ko(cid:276)cu., 86
wci(cid:266)cie tekstu, 310
wci(cid:286)ni(cid:266)cie
klawisza, 157
przycisku myszy, 214
wczytanie daty z systemu operacyjnego, 29
while, 81, 84
width, 269
wi(cid:266)ksze, 41
lub równe, 41
w(cid:225)a(cid:286)ciwo(cid:286)(cid:252), 61
w(cid:225)(cid:261)czanie i wy(cid:225)(cid:261)czanie formatowania, 265
wpisanie warto(cid:286)ci zwracanej do programu, 57
wrap, 191
wskazanie
akapitu kursorem, 211
obszaru kursorem, 218
wska(cid:296)nik myszy usuni(cid:266)ty z monitorowanego
obszaru, 220
wspó(cid:225)rz(cid:266)dna
pionowa wska(cid:296)nika myszy w stosunku
do bie(cid:298)(cid:261)cego okna, gdy zdarzenie zosta(cid:225)o
zarejestrowane, 163
ekranu, gdy zdarzenie zosta(cid:225)o zarejestrowane, 163
klikni(cid:266)tego miejsca w stosunku do bie(cid:298)(cid:261)cego
okna, 164
wstawianie elementu we wskazanym miejscu, 246
wybranie tekstu, 160
wydzielenie
cz(cid:266)(cid:286)(cid:252) ci(cid:261)gu, 142
liczby z tekstu, 131
tekstu bez znaczników HTML, 233
wykonanie
ga(cid:225)(cid:266)zi programu, 42
kodu okre(cid:286)lon(cid:261) liczb(cid:266) razy, 90
wynik porównywania, 41
wyró(cid:298)nienie akapitu, który zawieraj(cid:261) ci(cid:261)g znaków, 187
wyskakuj(cid:261)ce okno, 80, 206
wys(cid:225)anie formularza, 160
wysuni(cid:266)cie papieru, 141
wyszarzenie, 194
wy(cid:286)wietlanie
fragmentu tekstu w oknie komunikatu, 229
komunikatu po klikni(cid:266)ciu, 208
odsy(cid:225)aczy, 184
okna
komunikatu, 58
po za(cid:225)adowaniu strony g(cid:225)ównej, 206
tekstu, 250
wzorzec dopasowania, 64
X
x do pot(cid:266)gi y, 121
Z
zako(cid:276)czenie operacji, 297
zamiana
ci(cid:261)gu na tablic(cid:266), 142
liter, 146
na ma(cid:225)e, 142
na wielkie, 142, 157
znaków w stringu, 142
zaokr(cid:261)glanie
liczb, 135
w dó(cid:225) do najbli(cid:298)szej liczby ca(cid:225)kowitej, 121
w gór(cid:266) do najbli(cid:298)szej liczby ca(cid:225)kowitej, 121
do najbli(cid:298)szej liczby ca(cid:225)kowitej, 121
zapis wyk(cid:225)adniczy, 39, 124
zaprzeczenie, 45
zasi(cid:266)g zmiennej, 52
zdarzenie, 153, 205
zablokowane, 162
zgodno(cid:286)(cid:252) warto(cid:286)ci i typów, 41
zmiana
adresu po klikni(cid:266)ciu przycisku, 240
atrybutów w kodzie HTML, 240
czcionki, 186
elementu formularza, 160, 224
przezroczysto(cid:286)ci, 276
rozmiarów widoku dokumentu, 159
zmienna, 27, 134
czas (cid:298)ycia, 52
globalna, 52
lokalna, 55
typ, 139
warto(cid:286)(cid:252), 36
zmiennoprzecinkowa liczba, 125
znak
na pozycji n w stringu, 142
znak specjalny, 141
zwolnienie
przycisku myszy, 216
klawisza, 157
Kup książkęPoleć książkę
Pobierz darmowy fragment (pdf)
