jQuery_Poradnik_programisty_jquepp.pdf

(764 KB) Pobierz
• Nie utrudniaj sobie
życia
— skorzystaj z biblioteki
jQuery!
• Abecadło, czyli jak korzystać z dobrodziejstw biblioteki
jQuery
• Interfejs API biblioteki
jQuery,
czyli gdzie szukać zaawansowanych rozwiązań
• Wtyczki, czyli o co jeszcze warto rozszerzyć dostępne możliwości
JQuery. Poradnik
programisty
Autor:
W³odzimierz Gajda
ISBN: 978-83-246-2518-5
Format: 158235, stron: 288
Nie utrudniaj sobie ¿ycia — skorzystaj z biblioteki jQuery!
• Abecad³o, czyli jak korzystaæ z dobrodziejstw biblioteki jQuery
• Interfejs API biblioteki jQuery, czyli gdzie szukaæ zaawansowanych rozwi¹zañ
• Wtyczki, czyli o co jeszcze warto rozszerzyæ dostêpne mo¿liwoœci
Biblioteka jQuery, zarówno w wersji pe³nej, jak i zminimalizowanej, pozwala programiœcie
znacz¹co uproœciæ pracê i stopieñ skomplikowania kodu tworzonego w jêzyku
JavaScript. Korzystaj¹c z jej mo¿liwoœci, programista mo¿e zmieniaæ atrybuty,
modyfikowaæ wygl¹d poszczególnych elementów strony, dodawaæ lub usuwaæ elementy
drzewa DOM. Mo¿e te¿ wykonaæ zapytania Ajax, stosowaæ efekty specjalne, obs³u¿yæ
typowe i nietypowe zdarzenia, a tak¿e pos³u¿yæ siê ró¿nymi wtyczkami, czêsto
znacz¹co rozszerzaj¹cymi funkcjonalnoœæ kodu.
Ksi¹¿ka „jQuery. Poradnik programisty” to doskona³e kompendium wiedzy na temat tej
biblioteki. Dowiesz siê st¹d, jak rozpocz¹æ pracê z jQuery, jak obchodziæ siê z selektorami
i atrybutami, manipulowaæ modelem DOM czy przypisywaæ wybrany styl do okreœlonych
elementów strony. Nauczysz siê stosowaæ funkcjê jQuery, filtry i operacje na zbiorach
elementów. Poznasz tak¿e rodzaje i sposób dzia³ania wtyczek, sam zaczniesz je tworzyæ,
minimalizowaæ i kompresowaæ. Jeœli interesuje Ciê programowanie z wykorzystaniem
mo¿liwoœci oferowanych przez JavaScript, a nie chcesz spêdzaæ wielu godzin na
bezpoœrednim wpisywaniu skomplikowanego kodu, biblioteka jQuery jest w³aœnie
dla Ciebie!
• Korzystanie z biblioteki jQuery
• Trzy warstwy dokumentu XHTML: struktura, wygl¹d i zachowanie
• Selektory CSS i zdarzenia XHTML
• Modyfikacja wygl¹du, odczyt i modyfikacja treœci elementów
• Odczyt i modyfikacja atrybutów
• Dodawanie i usuwanie wêz³ów drzewa DOM, wêdrówka po drzewie DOM
• Zbiory wêz³ów, tworzenie i usuwanie wêz³ów w drzewie DOM
• Efekty specjalne
• Funkcja jQuery() – w skrócie $()
• Odczyt i modyfikacja wêz³ów drzewa DOM
• Operacje przekszta³caj¹ce zbiór elementów
• Parametry wtyczek, ich tworzenie, minimalizacja i kompresja
Wykorzystaj szanse, jakie daje Ci biblioteka jQuery!
Spis tre ci
Czö è I
Abecadäo ....................................................................... 5
Poprawno ü osadzania kodu JavaScript w dokumentach HTML i XHTML .................. 13
Rozdziaä 1. Korzystanie z biblioteki jQuery .......................................................... 7
Rozdziaä 2. Trzy warstwy dokumentu XHTML: struktura, wyglñd i zachowanie .... 15
Rozdziaä 3. Selektory CSS i zdarzenia XHTML ................................................... 21
Rozdziaä 4. Modyfikacja wyglñdu elementów .................................................... 29
Rozdziaä 5. Odczyt i modyfikacja tre ci elementów ........................................... 39
Rozdziaä 6. Odczyt i modyfikacja atrybutów ...................................................... 47
Rozdziaä 7. Dodawanie i usuwanie wözäów drzewa DOM .................................... 59
Rozdziaä 8. Wödrówka po drzewie DOM ............................................................ 79
Rozdziaä 9. Zbiory wözäów ................................................................................ 95
Rozdziaä 10. Ajax ............................................................................................. 109
Rozdziaä 11. Efekty specjalne .......................................................................... 129
Rozdziaä 12. Co powiniene zapamiötaè z pierwszej czö ci? .............................. 139
Czö è II
Interfejs API biblioteki jQuery ..................................... 143
Wywoáanie $(funkcja) .................................................................................................. 145
Wywoáanie $(kod XHTML) ......................................................................................... 146
Wywoáanie $(selektor) ................................................................................................. 150
Wywoáanie $(element DOM) ....................................................................................... 154
Wynik funkcji $ ............................................................................................................ 156
Tworzenie w záów tekstowych ..................................................................................... 159
Funkcje i metody statyczne .......................................................................................... 159
Rozdziaä 13. Funkcja jQuery() — w skrócie $() ................................................. 145
Rozdziaä 14. Selektory ..................................................................................... 163
Zestawienie selektorów filtruj cych ............................................................................. 164
U ycie selektorów ........................................................................................................ 167
Wyst powanie selektorów ............................................................................................ 169
4
jQuery. Poradnik programisty
Rozdziaä 15. Odczyt i modyfikacja wözäów drzewa DOM .................................... 173
Rozszerzona skáadnia metod dost pu do w záów ......................................................... 176
Peáne zestawienie metod dost pu do w záów ............................................................... 178
Rozdziaä 16. Tworzenie i usuwanie wözäów w drzewie DOM ............................... 185
Klonowanie w záów ..................................................................................................... 189
Usuwanie w záów ......................................................................................................... 190
Wymiana w záów ......................................................................................................... 191
Zawijanie w záów ......................................................................................................... 194
Rozdziaä 17. Operacje przeksztaäcajñce zbiór elementów ................................... 197
Dodawanie w záów do zbioru ...................................................................................... 197
Operacja „cofnij” .......................................................................................................... 201
Filtrowanie .................................................................................................................... 203
Zliczanie elementów zbioru .......................................................................................... 204
Przodkowie, potomkowie i rodze stwo ........................................................................ 205
Przetwarzanie w záów tekstowych ............................................................................... 208
Rozdziaä 18. Co powiniene zapamiötaè z drugiej czö ci? .................................. 215
Czö è III Wtyczki ..................................................................... 217
Rozdziaä 19. Pierwsza wtyczka ......................................................................... 219
Wywoáanie wtyczki ...................................................................................................... 221
à czenie biblioteki jQuery z innymi bibliotekami JavaScript ...................................... 224
Definiowanie kilku wtyczek w jednym pliku .js ........................................................... 226
Rozdziaä 20. Parametry wtyczek ....................................................................... 231
Badanie obecno ci parametru ....................................................................................... 232
Obiekty w roli parametrów ........................................................................................... 233
Badanie typu parametrów ............................................................................................. 235
Zmienna liczba parametrów funkcji ............................................................................. 238
Rozdziaä 21. Tworzenie wtyczek ....................................................................... 241
Rozdziaä 22. Minimalizacja i kompresja wtyczek ............................................... 265
Kompresja .................................................................................................................... 266
Rozdziaä 23. Co powiniene zapamiötaè z trzeciej czö ci? ................................. 271
Skorowidz .................................................................................... 273
Rozdziaä 11.
Efekty specjalne
Biblioteka jQuery zawiera kilka metod sáu cych do wykonywania prostych animacji.
Nale do nich:
slideDown()
i
slideUp()
,
fadeIn()
i
fadeOut()
oraz
animate()
.
Metody
slideDown()
i
slideUp()
pozwalaj na páynne rozwijanie i zwijanie elementu.
Efekt graficzny polega na animacji elementu poprzez zwi kszenie lub zmniejszenie jego
wysoko ci. Je li na ukrytym akapicie:
$('p#info').hide();
wywoáamy metod
slideDown()
:
$('p#info').slideDown();
to akapit ten pojawi si na stronie w sposób animowany. Jego wysoko ü b dzie páynnie
zwi kszana od 0 do odpowiedniej warto ci. Wywoáanie metody
slideUp()
spowoduje
ponowne ukrycie akapitu:
$('p#info').slideUp();
Tym razem jego wysoko ü b dzie zmniejszana do 0. Domy lnie animacja trwa 400 mili-
sekund, lecz mo emy to zmieniü, przekazuj c do metod
slideDown()
oraz
slideUp()
parametr okre laj cy czas trwania animacji. Parametrem tym mo e byü liczba okre la-
j ca, ile milisekund ma trwaü animacja, np.:
$('p#info').slideUp(1200);
$('p#info').slideDown(2500);
b d jeden z napisów:
slow
lub
fast
. Napis
slow
ustala czas trwania animacji na 200 mili-
sekund, a
fast
— na 600. Drugim, równie opcjonalnym, parametrem funkcji
slideUp()
i
slideDown()
jest funkcja anonimowa, wywoáywana po zako czeniu animacji. Je li
chcesz, by po zako czeniu rozwijania akapitu kolor jego táa staá si czerwony, u yj kodu:
$('p#info').slideDown(2500, function(){
$('p#info').css('background', 'red');
});
Zgłoś jeśli naruszono regulamin