Różnica między $ .ajax () a $ .get () i $ .load ()

Odpowiedzi:

241

$.ajax()jest najbardziej konfigurowalnym, gdzie masz precyzyjną kontrolę nad nagłówkami HTTP i tym podobnymi. Możesz również uzyskać bezpośredni dostęp do obiektu XHR za pomocą tej metody. Zapewniona jest również nieco bardziej szczegółowa obsługa błędów. Dlatego może być bardziej skomplikowane i często niepotrzebne, ale czasami bardzo przydatne. Ze zwróconymi danymi musisz sobie poradzić samodzielnie poprzez oddzwonienie.

$.get()jest tylko skrótem, $.ajax()ale odciąga niektóre konfiguracje, ustawiając rozsądne wartości domyślne dla tego, co przed tobą ukrywa. Zwraca dane do wywołania zwrotnego. Dopuszcza tylko żądania GET, więc towarzyszy jej $.post()funkcja podobnej abstrakcji, tylko dla POST

.load()jest podobny do, $.get()ale dodaje funkcjonalność, która pozwala określić, gdzie w dokumencie mają być wstawione zwracane dane. Dlatego naprawdę użyteczne tylko wtedy, gdy wywołanie spowoduje tylko HTML. Nazywa się to nieco inaczej niż pozostałe wywołania globalne, ponieważ jest to metoda powiązana z określonym elementem DOM opakowanym w jQuery. Dlatego należałoby zrobić:$('#divWantingContent').load(...)

Należy zauważyć, że wszystko $.get(), $.post(), .load()są tylko opakowania na $.ajax()jak to się nazywa wewnętrznie.

Więcej szczegółów w dokumentacji Ajax jQuery: http://api.jquery.com/category/ajax/

Alexander Sagen
źródło
3
@UzairAli nie, dosłownie pobiera zmienne, które do niego przekazujesz i używa ich do wykonania jQuery.ajax ()
lisburnite
1
Świetnie, .load () to zwykły HTML, a .get () jest przydatny do innych rzeczy.
Luigi Lopez
30

Metody zapewniają różne warstwy abstrakcji.

  • $.ajax()daje pełną kontrolę nad żądaniem Ajax. Powinieneś go użyć, jeśli inne metody nie spełniają twoich potrzeb.

  • $.get()wykonuje GETżądanie Ajax . Zwrócone dane (które mogą być dowolnymi danymi) zostaną przekazane do programu obsługi wywołań zwrotnych.

  • $(selector).load()wykona GETżądanie Ajax i ustawi zawartość wybranych zwróconych danych (które powinny być tekstem lub HTML).

Zależy to od sytuacji, której metody należy użyć. Jeśli chcesz robić proste rzeczy, nie musisz się tym przejmować $.ajax().

Np. Nie użyjesz $.load(), jeśli zwrócone dane będą w formacie JSON, który należy dalej przetwarzać. Tutaj możesz użyć $.ajax()lub $.get().

Felix Kling
źródło
9

http://api.jquery.com/jQuery.ajax/

jQuery.ajax()

Opis: wykonaj asynchroniczne żądanie HTTP (Ajax).

Pełny monty pozwala na wykonanie dowolnego żądania Ajax.


http://api.jquery.com/jQuery.get/

jQuery.get()

Opis: ładowanie danych z serwera przy użyciu żądania HTTP GET.

Pozwala tylko na wykonywanie żądań HTTP GET, wymaga trochę mniej konfiguracji.


http://api.jquery.com/load/

.load()

Opis: Załaduj dane z serwera i umieść zwrócony kod HTML w dopasowanym elemencie.

Specjalizuje się w pobieraniu danych i wprowadzaniu ich do elementu.

zamrozić
źródło
8

Bardzo proste, ale

  • $.load(): Załaduj fragment kodu HTML do kontenera DOM.
  • $.get(): Użyj tego, jeśli chcesz wykonać połączenie GET i intensywnie bawić się odpowiedzią.
  • $.post(): Użyj tego, jeśli chcesz wykonać wywołanie POST i nie chcesz ładować odpowiedzi do jakiegoś kontenera DOM.
  • $.ajax(): Użyj tego, jeśli chcesz coś zrobić, gdy XHR zawiedzie, lub musisz określić opcje Ajax (np. Cache: true) w locie.
Tim
źródło
5

Ważna uwaga: metoda jQuery.load () może wykonywać nie tylko żądania GET, ale również POST , jeśli podano parametr data (patrz: http://api.jquery.com/load/ )

typ danych : PlainObject lub String Zwykły obiekt lub ciąg, który jest wysyłany do serwera wraz z żądaniem.

Metoda żądania Metoda POST jest używana, jeśli dane są dostarczane jako obiekt; w przeciwnym razie zakłada się GET .

Example: pass arrays of data to the server (POST request)
$( "#objectID" ).load( "test.php", { "choices[]": [ "Jon", "Susan" ] } );
pymen
źródło
3

Każdy ma rację. Funkcje .load, .geti .postto różne sposoby korzystania z funkcji .ajax.

Osobiście uważam, że funkcja surowa .ajax jest bardzo myląca i wolę używać funkcji load, get lub post tak, jak tego potrzebuję.

POST ma następującą strukturę:

$.post(target, post_data, function(response) { });

GET ma następujące elementy:

$.get(target, post_data, function(response) { });

LOAD ma następujące cechy:

$(*selector*).load(target, post_data, function(response) { });

Jak widać, różnice między nimi są niewielkie, ponieważ to sytuacja decyduje o tym, którego użyć. Chcesz wewnętrznie wysłać informacje do pliku? Użyj .post (w większości przypadków). Potrzebujesz wysłać informacje w taki sposób, abyś mógł podać link do konkretnego momentu? Użyj .get. Oba pozwalają na wywołanie zwrotne, w którym możesz obsłużyć odpowiedź plików.

Ważną uwagą jest to, że .load działa na dwa różne sposoby. Jeśli podasz tylko adres URL dokumentu docelowego, będzie on działał jako get (a mówię: działaj, ponieważ testowałem sprawdzanie $_POSTw wywołanym PHP przy użyciu domyślnego zachowania .load i wykrywa $_POST, a nie$_GET ; może bardziej precyzyjne byłoby powiedz, że działa jak .post bez żadnych argumentów); jednak jako http://api.jquery.com/load/mówi, że gdy podasz tablicę argumentów do funkcji, POST poinformuje o tym do pliku. Niezależnie od przypadku, funkcja .load wstawi informacje bezpośrednio do elementu DOM, który w WIELU przypadkach jest bardzo czytelny i bardzo bezpośredni; ale nadal zapewnia oddzwonienie, jeśli chcesz zrobić coś więcej z odpowiedzią. Dodatkowo .load umożliwia wyodrębnienie określonego bloku kodu z pliku, co daje możliwość zapisania katalogu np. W pliku html i pobrania jego fragmentów (elementów) bezpośrednio do elementów DOM.

Isaac Levi Felix Salinas
źródło
1

Oba są używane do wysyłania niektórych danych i otrzymywania odpowiedzi przy użyciu tych danych.

POBIERZ : Uzyskaj informacje przechowywane na serwerze. (tj. wyszukiwanie, tweet, informacje o osobie). Jeśli chcesz wysłać informacje, uzyskaj żądanie wysłania żądania za pomocą process.php?name=subrotoWięc zasadniczo wysyła informacje przez adres URL. Adres URL nie może obsłużyć więcej niż 2036 znaków. Więc jeśli chodzi o post na blogu, czy pamiętasz, że nie jest to możliwe?

POST : Post robi to samo, co GET. Rejestracja użytkownika, logowanie użytkownika, przesyłanie dużych danych, post na blogu. Jeśli chcesz wysłać bezpieczne informacje, użyj poczty lub dużych zbiorów danych, ponieważ nie przechodzą one przez adres URL.

AJAX : $.get()i $.post()zawiera funkcje, które są podzbiorami $.ajax(). Ma więcej konfiguracji.

$.get ()metoda, która jest rodzajem skrótu dla $.ajax(). Podczas używania$.get () zamiast przekazywać obiekt, przekazujesz argumenty. Jako minimum będziesz potrzebować dwóch pierwszych argumentów, czyli adresu URL pliku, który chcesz pobrać (np. Test.txt) i wywołania zwrotnego sukcesu.

Subroto Biswas
źródło
0

Wszyscy bardzo dobrze wyjaśnili temat. Jest jeszcze jeden punkt, który chciałbym dodać na temat metody .load ().

Jak na dokumentem Załaduj, jeśli dodasz sufiksowany selektor w adresie URL danych, nie będzie on wykonywał skryptów podczas ładowania treści.

Pracujący Plunker

            $(document).ready(function(){
                $("#secondPage").load("mySecondHtmlPage.html #content");
            })

Z drugiej strony, po usunięciu selektora w url, uruchomione zostaną skrypty w nowej treści. Próbować ten przykład

po usunięciu #content z adresu URL w pliku index.html

            $(document).ready(function(){
                $("#secondPage").load("mySecondHtmlPage.html");
            })

W dyskusji nie ma takiej wbudowanej funkcji zapewnianej przez inne metody.

Deepak Kumar
źródło