Spisie treści
Jeszcze kilka lat temu myślano o tym Ajaks jako przyszłość aplikacji internetowych, po tym, jak zaczęła się jego umasowienie z Gmailem, jednak dziś trzeba uznać, że jest to rzeczywistość, w rzeczywistości strona, która w tej chwili nie zawiera Ajax w jakiś sposób, nie jest zbyt dobrze postrzegana.Ajax to zestaw technik, które pozwalają nam wysyłać i odbierać informacje bez konieczności odświeżania dokumentu lub ponownego ładowania strony, więc w uproszczeniu można powiedzieć, że jest to narzędzie do zapisywania i przyspieszania nawigacji.
Co to jest Ajax?
Ajax odpowiada na akronim od Asynchroniczny JavaScript i XML mianowicie JavaScript Tak XML asynchroniczny, jednak obecnie używany jest format JSON częściej niż XML, JSON jest nawet uważany przez wielu za standard.
Wszystko to skutkuje czymś bardzo prostym do wyjaśnienia, odbieraniem i wysyłaniem danych niezależnie od ładowania i odświeżania stron, na przykład jeśli chcemy, aby za każdym razem, gdy klikniemy w przycisk i część strony przyniosła dane z bazy danych , zamiast wysyłać żądanie do serwera poprzez przesłanie formularza i odświeżenie całej strony, zrobimy to za pomocą funkcji Javascript i żądania Żądanie XMLHttp komunikować się z serwerem w celu pobrania danych i zmieniać tylko potrzebną nam część strony.
Jak widzimy, wygląda i brzmi cudownie, jedynym problemem lub ograniczeniem jest użycie JavaScript, ponieważ jeśli wyłączymy go w naszej przeglądarce, nie będziemy mogli korzystać z tych funkcji.
Nasz pierwszy dokument z Ajax
Teraz, gdy znamy podstawy i podstawy Ajaksu, opracujemy mały przykład, który może nam zilustrować tę technikę.
Najpierw zobaczmy poniższy kod, a następnie wyjaśnimy, czemu on odpowiada:
PrzykładJabłka Wiśnie Bananynaciśnij przycisk
Ten przykład po prostu robi to, że kiedy klikamy przycisk, uruchamiamy funkcję o nazwie UchwytPrzyciskNaciśnij (), to tworzy nowy obiekt typu Żądanie XMLHttp i dzięki temu możemy wziąć HTML wewnątrz przycisku, wziąć jego tekst i połączyć go z rozszerzeniem .HTML, aby móc wywołać wcześniej utworzony dokument o tej samej nazwie.
Następnie funkcja uchwytOdpowiedź dokonuje weryfikacji statusu żądania, jeśli zakończyło się powodzeniem, w wyznaczonym już kontenerze załaduje odpowiedni dokument, który wywołaliśmy.
Zobaczmy na obrazach, jak będzie wyglądał przebieg procesu:
Na pierwszym obrazie jesteśmy proszeni o kliknięcie jednego z przycisków, następnie gdy to zrobimy na drugim obrazie widzimy jak ładowana jest treść, która zgodnie z funkcją Ajaks opisany w przykładzie kod pochodzi z dokumentu HTML już utworzona, ta zawartość jest ładowana do div, w którym znajdowała się instrukcja, która mówiła, aby nacisnąć przycisk.
Na tym kończymy samouczek, mamy już możliwość rozpoczęcia eksperymentowania Ajaks aby wzbogacić przeglądanie naszych stron lub dokumentów HTML.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt