Interaktywność sieci jako wprowadzenie do jQuery

jQuery to biblioteka skryptów po stronie klienta, z której korzysta prawie każda nowoczesna strona internetowa - sprawia, że ​​strony internetowe są interaktywne. Nie jest to jedyna biblioteka JavaScript, ale jest najbardziej rozwinięta, najczęściej obsługiwana i najczęściej używana. Jest to jeden z elementów każdej nowoczesnej strony internetowej. Ale czym dokładnie jest jQuery, co sprawia, że ​​jest tak popularny i dlaczego warto się nim przejmować, jeśli zaczynasz jako programista stron internetowych?

Co to jest jQuery?

jQuery jest rozszerzeniem Javascript, biblioteki funkcji i narzędzi Javascript, które dodają wizualnego stylu i sprawiają, że zaawansowane funkcje są łatwe do zaimplementowania w zaledwie kilku liniach kodu. Jest obsługiwany w różnych przeglądarkach i open source. Dodatkowo możesz rozszerzyć funkcjonalność jQuery o łatwe w użyciu wtyczki.

jQuery jest zbudowany na JavaScript, ale dodaje metody i funkcje, których nie ma w czystym JavaScript. Został stworzony w celu uproszczenia korzystania z Javascript i usunięcia problemów związanych z różnymi implementacjami Javascript w różnych przeglądarkach. Dzięki jQuery możesz napisać tylko raz, a jQuery poprawnie zinterpretuje kod dla dowolnej przeglądarki.

Główną funkcją jQuery jest manipulacja DOM (DOM to Document Object Model), i oznacza ona strukturę leżącą u podstaw każdej odwiedzanej strony. Każda rzecz, którą widzisz na stronie - i wiele, których nie widzisz - są reprezentowane w DOM.

jQuery nie jest jedyną dostępną biblioteką JavaScript, ale jest najpopularniejsza - korzysta z niej około 55% z 10 000 najlepszych stron internetowych. Prototype, MooTools i Scriptaculous są popularnymi alternatywami, ale nie są tak dobrze obsługiwane.

Po stronie klienta vs. po stronie serwera

Większość stron internetowych jest generowana po stronie serwera - MakeUseOf używa PHP i MySQL (w formie WordPress), aby pobrać dane artykułu z bazy danych, a następnie zastosować szablon do tych danych. Powstała strona jest wysyłana do przeglądarki, interpretowana i wyświetlana. Kliknięcie linku powoduje ponowne wysłanie żądania do bazy danych i generowanie kolejnej strony. Ale co, jeśli chcesz stworzyć interaktywność na stronie? Formularz sprawdzający, co wpisuje użytkownik (np. Twitter, który liczy, ile liter pozostało), przycisk, który wyświetla okno dialogowe, a może chcesz załadować więcej danych bez ponownego ładowania całej strony?

To gdzie skrypty po stronie klienta wchodzi w grę. Właśnie tam klient - Twoja przeglądarka - wykonuje ciężkie prace. Większość stron internetowych, w tym ta, używa trochę obu.

Dlaczego warto korzystać z jQuery?

Wizualny talent

jQuery pozwala zmieniać części strony w odpowiedzi na działania użytkownika. Jako szybki przykład kliknij ten link - każdy link na stronie będzie zmień kolor na czerwony. Nieprzydatny? Być może, ale rozumiesz. Pokazy slajdów są powszechnym zastosowaniem jQuery. Równoważenie bezcelowych efektów wizualnych i naprawdę przydatnych dodatków do doświadczenia użytkownika jest częścią umiejętności bycia programistą.

Oto krótka lista naprawdę niesamowitych efektów, które możesz osiągnąć.

Łatwe wydarzenia

Prawie całe oprogramowanie działa na modelu zdarzeń - kliknij na coś, a zostanie uruchomione zdarzenie kliknięcia. Przeciągnij palcem po tablecie, a uruchomione zostanie zdarzenie przeciągania. Aplikacje “słuchać” na te zdarzenia i zrób coś - jQuery pozwala to zrobić w przeglądarce.

Wykonaj AJAX po prostu

Asynchroniczne JavaScript i XML to sposób komunikowania się ze zdalnym serwerem bez konieczności ładowania innej strony. Dobrym przykładem tego jest strumień statusu na Facebooku. Spróbuj przewinąć wszystkie aktualizacje, aż dojdziesz do końca. Nie możesz Jak tylko dojdziesz do końca, jQuery wykrywa, że ​​jesteś blisko i wysyła żądanie AJAX, aby wyświetlić więcej statusów.

Następnie wstrzykuje je na bieżącą stronę, nie zdając sobie z tego sprawy. Otrzymujesz nieskończony strumień aktualizacji, ale nie wszystkie są ładowane na początku.

Zaawansowane interfejsy użytkownika

Wraz z podstawową wtyczką jQuery UI możesz tworzyć kompletne aplikacje internetowe przy użyciu standardowych komponentów formularza; paski postępu, suwaki, przyciski, zakładki, przeciągnij i upuść - to wszystko. Prosty system tematyczny pozwala dostosować wygląd i działanie lub możesz użyć jednego z ustawień domyślnych.

Powinienem się martwić?

Jeśli w ogóle interesujesz się tworzeniem stron internetowych, którego języka programowania należy się uczyć - programowania internetowego, języka programowania, którego należy się uczyć - programowania internetowego Dzisiaj przyjrzymy się różnym językom programowania w sieci, które napędzają Internet. To czwarta część serii programowania dla początkujących. W części 1 poznaliśmy podstawy…, a następnie tak - jQuery jest rzeczą, której zdecydowanie musisz się nauczyć. Jeśli kiedykolwiek zadałeś sobie pytanie “Jak mogę zmusić X do wykonania Y, gdy użytkownik robi Z.?”, pokochasz jQuery. Dodanie go do witryny jest tak proste, jak dodanie linku do niego w nagłówku; lub nakazanie WordPressowi załadowania.

Czy chciałbyś nauczyć się jQuery? Daj nam znać w komentarzach, a zobaczę, co mogę zrobić.

Kredyty obrazkowe: Dynamiczny obrotowy billboard stworzony przy użyciu jQuery, PistolSlut.com, wykres wykonany za pomocą jQuery