Najlepsze pytania
Chronologia
Czat
Perspektywa
JQuery
biblioteka języka JavaScript Z Wikipedii, wolnej encyklopedii
Remove ads
jQuery – lekka biblioteka programistyczna dla języka JavaScript, ułatwiająca korzystanie z JavaScriptu (w tym manipulację drzewem DOM). Kosztem niewielkiego spadku wydajności w stosunku do profesjonalnie napisanego kodu w niewspomaganym JavaScripcie pozwala osiągnąć interesujące efekty animacji, dodać dynamiczne zmiany strony, wykonać zapytania AJAX. Większość wtyczek i skryptów opartych na jQuery działa na stronach, nie wymagając zmian w kodzie HTML (np. zamienia klasyczne galerie złożone z miniatur linkujących do obrazków w dynamiczną galerię).
Remove ads
Remove ads
Funkcjonalność
jQuery pozwala w wygodny i zrozumiały sposób korzystać z następujących funkcjonalności:
- selektory – umożliwiają wybranie dowolnego podzbioru węzłów modelu DOM
- atrybuty – jQuery pozwala przetwarzać atrybuty węzłów dokumentu
- manipulowanie modelem DOM
- zmiana i przypisywanie stylu do elementów
- rozbudowana obsługa zdarzeń, możliwość definiowania własnych
- efekty – animacje
- AJAX – prosty interfejs realizujący asynchroniczne zapytania
Remove ads
Podstawowe cechy
- Niezależność od przeglądarki – eliminuje konieczność dostosowywania kodu do różnych przeglądarek WWW
- Obsługa selektorów zgodna z CSS3
- Małe rozmiary – produkcyjna wersja to tylko ok. 30kB (dla skompresowanej wersji 3.4.1)
- Wygoda tworzenia wtyczek
Remove ads
Użycie
Podsumowanie
Perspektywa
Z biblioteki jQuery można korzystać na dwa sposoby:
- Użyć funkcji
$
lubjQuery
($
jest standardowym aliasem obiektujQuery
). Funkcja ta i inne metody zwracają obiektjQuery
, co oznacza, że można łatwo łączyć je w łańcuch wywołań. - Używać
$.
lubjQuery.
jako swoistego prefiksu. Czyli korzystać z metod narzędziowych nie operujących na obiekcie jQuery jako takim.
Typowe wykorzystanie biblioteki jQuery polega na przekazaniu selektora CSS funkcji $
, której wynikiem jest tablica referencji do obiektów dopasowanych elementów (tablica może być pusta). Następnie na tej tablicy wykonuje się dodatkowe operacje poprzez metody obiektu jQuery
. Na przykład skrypt:
jQuery("div.test").append(jQuery('<p class="quote"/>').addClass('blue').slideDown('slow'));
pobierze tagi DIV z klasą test
, doda pusty paragraf o klasie quote
, doda klasę o nazwie blue
i utworzy animację.
Metody z prefiksem $.
lub jQuery.
są metodami samodzielnymi lub działają globalnie. Poniższy przykład wykorzysta funkcję mapującą o nazwie each
:
jQuery.each([1,2,3], function(klucz, wartosc) {
document.write(klucz + "=" + wartosc + "<br/>");
});
Przykład powyżej wydrukuje na ekranie: 0=1 1=2 2=3
jQuery oferuje również niezależny od przeglądarki interfejs do synchronicznych oraz asynchronicznych żądań HTTP (AJAX). Standaryzuje on różne implementacje obiektu XMLHttpRequest
. Zapytania obsługuje się poprzez metodę globalną jQuery.post
lub jQuery.get
. Metody te różnią się od siebie tym, że jQuery.post
wysyła dane za pomocą POST, a jQuery.get
wysyła dane za pomocą GET.
jQuery.post("skrypt.php", {"klucz": "wartość", "a": 13}, function(json) {
alert("Dane otrzymane: " + json.klucz + ", " + json.a);
}, "json");
W powyższym przykładzie skrypt wyśle żądanie do pliku skrypt.php
, przekazując mu parametry klucz
i a
(w żądaniu typu POST). Po pomyślnym przesłaniu danych wywołana zostanie funkcja przypisana do opcji trzeciej, która w tym wypadku wyświetli komunikat z odpowiedzią zwróconą przez skrypt.
Historia wydań
Remove ads
Przypisy
Linki zewnętrzne
Wikiwand - on
Seamless Wikipedia browsing. On steroids.
Remove ads