Biblioteka jQuery  podstawowe informacje
żð Biblioteka jQuery stanowi zbiór procedur uÅ‚atwiajÄ…cych
operowanie na dokumencie WWW poprzez język JavaScript i
model DOM (Document Object Model).
żð Jest to biblioteka dostÄ™pna bezpÅ‚atnie w ramach licencji GNU
Biblioteka jQuery
GPL oraz MIT
żð Strona domowa projektu: http://jquery.com
żð Witryna z dokumentacjÄ…: http://docs.jquery.com
żð Biblioteki elementów interfejsu użytkownika: http://jqueryui.com
134
Biblioteka jQuery  podstawowe informacje Korzystanie z biblioteki jQuery
żð Biblioteka jQuery zorientowana jest na dostarczenie funkcjonalnoÅ›ci żð Biblioteka zawarta jest w pliku o nazwie jquery.js
zwiÄ…zanych z:
żð Plik może pochodzić z lokalizacji lokalnej lub jednego
żð ZaawansowanÄ… selekcjÄ… elementów dokumentu z publicznych serwerów np.
http://code.google.com/apis/ajaxlibs/documentation/#jquery
żð Modyfikowaniem wyglÄ…du dokumentu WWW poprzez CSS
żð DynamicznÄ… zmianÄ… zawartoÅ›ci dokumentu, w tym także w powiÄ…zaniu z
efektami animacyjnymi

żð ObsÅ‚ugÄ… interakcji z użytkownikiem
żð ZaawansowanÄ… obsÅ‚ugÄ… zdarzeÅ„
żð ObsÅ‚ugÄ… obiektu XMLHttpRequest (AJAX)
żð Wykorzystaniem zewnÄ™trznych wtyczek (plug-ins) i modułów bazujÄ…cych
na JQuery do realizacji określonych zadań
żð Użycie biblioteki jQuery w dużym stopniu odciążą programistÄ™ od
tworzenia osobnych wersji kodu JS dla poszczególnych przeglądarek
żð W praktyce, pomimo dużego nacisku na standaryzacjÄ™ technologii
webowych, nadal występują różnice w dostępności i funkcjonalności
poszczególnych obiektów w różnych przeglądarkach
135 136
Korzystanie z biblioteki jQuery Korzystanie z biblioteki jQuery
żð Z biblioteki jQuery korzysta siÄ™ poprzez użycie w skrypcie funkcji jQuery żð Jeżeli (zgodnie z zaleceniami dobrego kodu strony) wywoÅ‚anie funkcji
lub $ (jest to alias dla jQuery). jQuery zostanie umieszczone w nagłówku dokumentu to zostanie ona
wywołana jeszcze przed zainicjowaniem całego drzewa DOM i
żð Funkcja (obiekt) $ i jego metody zwracajÄ… obiekt jQuery, który może być
poszczególne obiekty dokumentu nie będą dla niej dostępne.
użyty w kolejnym łańcuchowym wywołaniu funkcji $:
żð Pewnym rozwiÄ…zaniem może być wywoÅ‚anie funkcji jQuery w ramach
$(parametr4).metoda3($(parametr3).metoda2(parametr2).metoda1(parametr1)
obsługi zdarzenia onload jednak zostanie ono wywołane dopiero po
żð Parametr funkcji $ wybiera obiekt DOM na którym wykonana zostanie
wczytaniu całej strony (łącznie z obrazkami itd.) co może mocno opóz
nić
określona metoda (z wykorzystaniem wymaganych przez nią parametrów)
wykonanie kodu, a dodatkowo wymaga zmodyfikowania samego kodu
HTML.
żð Stosowane sÄ… tutaj selektory analogiczne jak w CSS
żð Dlatego najczęściej wÅ‚asnÄ… funkcjÄ™ wywoÅ‚uje siÄ™ poprzez metodÄ™ ready,
żð PrzykÅ‚adowo jeżeli chcemy zawarte na stronie odnoÅ›niki (czyli elementy
która spowoduje że zostanie ona wykonana od razu po załadowaniu DOM:
) przypisać dynamicznie do klasy  linki (co jest równoważne
statycznemu zapisowi wywołujemy metodę addClass
// wariant z osobną funkcją (musi być osobno zdefiniowana)
obiektu $ z selektorem  a :
$(document).ready(nazwa_funkcji);
$( a ).addClass( linki )
// wariant z funkcjÄ… anonimowÄ…
// (nie definiuje niepotrzebnie dodatkowej nazwy w globalnej przestrzeni
$(document).ready(function () {kod_funkcji});
137 138
1
jQuery - przykłady
żð Plik jQ_Class.htm
żð Po naciÅ›niÄ™ciu przycisku zawarte na stronie odnoÅ›niki zostanÄ… przypisane
do odpowiedniej klasy, co spowoduje zastosowanie do nich stylu
określonego dla tej klasy. JavaScript - inne biblioteki
żð Plik jQ_Ajax.htm
żð Asynchroniczne wywoÅ‚anie skryptu na serwerze zwracajÄ…cego wartość
wpisaną w polu formularza i wyświetlenie otrzymanej odpowiedzi na stronie.
żð Dodatkowo zaimplementowano sprawdzenie czy dane zostaÅ‚y wprowadzone
żð Plik jQ_UI.htm
żð PrzykÅ‚ad wykorzystania obiektu datepicker pochodzÄ…cego ze zbioru User
Interface (UI), służącego do wyboru daty
139
Biblioteka Dojo Toolkit Biblioteka Ext-JS
żð Biblioteka Dojo zorientowana jest na tworzenie elementów żð Zorientowana głównie na tworzenie elementów interfejsu
interfejsu użytkownika, w tym także dla urządzeń mobilnych użytkownika
żð Jest to biblioteka dostÄ™pna bezpÅ‚atnie, także do zastosowaÅ„ żð Dla projektów open source dostÄ™pna na licencji GPLv3
komercyjnych
żð Strona domowa: http://sencha.com/products/extjs
żð Strona domowa projektu: http://dojotoolkit.org
141 142
2