Unterschied zwischen $ .ajax () und $ .get () und $ .load ()


Antworten:


240

$.ajax()ist die am besten konfigurierbare, bei der Sie eine detaillierte Kontrolle über HTTP-Header und dergleichen erhalten. Mit dieser Methode können Sie auch direkt auf das XHR-Objekt zugreifen. Es wird auch eine etwas feinkörnigere Fehlerbehandlung bereitgestellt. Kann daher komplizierter und oft unnötig sein, ist aber manchmal sehr nützlich. Sie müssen die zurückgegebenen Daten selbst mit einem Rückruf bearbeiten.

$.get()ist nur eine Abkürzung für $.ajax(), abstrahiert jedoch einige der Konfigurationen und legt angemessene Standardwerte für das fest, was es vor Ihnen verbirgt. Gibt die Daten an einen Rückruf zurück. Es erlaubt nur GET-Anfragen und wird daher von der $.post()Funktion für eine ähnliche Abstraktion begleitet, nur für POST

.load()ähnelt, $.get()fügt jedoch Funktionen hinzu, mit denen Sie festlegen können, wo in das Dokument die zurückgegebenen Daten eingefügt werden sollen. Daher wirklich nur verwendbar, wenn der Aufruf nur zu HTML führt. Es wird etwas anders aufgerufen als die anderen globalen Aufrufe, da es sich um eine Methode handelt, die an ein bestimmtes in jQuery eingeschlossenes DOM-Element gebunden ist. Daher würde man tun:$('#divWantingContent').load(...)

Es sollte beachtet werden , alle $.get(), $.post(), .load()sind alle nur Wrapper für , $.ajax()wie es intern genannt wird .

Weitere Details in der Ajax-Dokumentation von jQuery: http://api.jquery.com/category/ajax/


3
@UzairAli nein, es nimmt buchstäblich die Variablen, die Sie übergeben, und verwendet sie, um jQuery.ajax ()
lisburnite

1
Großartig, die .load () ist einfach nur HTML und die .get () ist nützlich für mehr Dinge.
Luigi Lopez

30

Die Methoden bieten verschiedene Abstraktionsebenen.

  • $.ajax()gibt Ihnen die volle Kontrolle über die Ajax-Anfrage. Sie sollten es verwenden, wenn die anderen Methoden Ihre Anforderungen nicht erfüllen.

  • $.get()führt eine Ajax- GETAnfrage aus. Die zurückgegebenen Daten (bei denen es sich um beliebige Daten handeln kann) werden an Ihren Rückruf-Handler übergeben.

  • $(selector).load()führt eine Ajax- GETAnforderung aus und legt den Inhalt der ausgewählten zurückgegebenen Daten fest (die entweder Text oder HTML sein sollten).

Es hängt von der Situation ab, welche Methode Sie verwenden sollten. Wenn Sie einfache Dinge tun möchten, müssen Sie sich nicht darum kümmern $.ajax().

ZB werden Sie nicht verwenden $.load(), wenn die zurückgegebenen Daten JSON sind, das weiter verarbeitet werden muss. Hier würden Sie entweder $.ajax()oder verwenden $.get().


9

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

jQuery.ajax()

Beschreibung: Führen Sie eine asynchrone HTTP-Anforderung (Ajax) aus.

Mit dem vollständigen Monty können Sie jede Art von Ajax-Anfrage stellen.


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

jQuery.get()

Beschreibung: Laden Sie Daten vom Server mithilfe einer HTTP-GET-Anforderung.

Sie können nur HTTP-GET-Anforderungen stellen und benötigen etwas weniger Konfiguration.


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

.load()

Beschreibung: Laden Sie Daten vom Server und platzieren Sie den zurückgegebenen HTML-Code in dem übereinstimmenden Element.

Spezialisiert, um Daten abzurufen und in ein Element einzufügen.


8

Sehr einfach aber

  • $.load(): Laden Sie ein Stück HTML in ein Container-DOM.
  • $.get(): Verwenden Sie diese Option, wenn Sie einen GET- Anruf tätigen und ausführlich mit der Antwort spielen möchten .
  • $.post(): Verwenden Sie diese Option, wenn Sie einen POST- Aufruf tätigen und die Antwort nicht in ein Container-DOM laden möchten.
  • $.ajax(): Verwenden Sie diese Option, wenn Sie etwas tun müssen, wenn XHR fehlschlägt, oder wenn Sie spontan Ajax-Optionen (z. B. Cache: true) angeben müssen.

5

Wichtiger Hinweis: Die Methode jQuery.load () kann nicht nur GET-, sondern auch POST- Anforderungen ausführen , wenn Datenparameter angegeben werden (siehe: http://api.jquery.com/load/ ).

Datentyp : PlainObject oder String Ein einfaches Objekt oder eine Zeichenfolge, die mit der Anforderung an den Server gesendet wird.

Anforderungsmethode Die POST- Methode wird verwendet, wenn Daten als Objekt bereitgestellt werden. Andernfalls wird GET angenommen.

Example: pass arrays of data to the server (POST request)
$( "#objectID" ).load( "test.php", { "choices[]": [ "Jon", "Susan" ] } );

3

Jeder hat es richtig. Funktionen .load, .getund .postsind verschiedene Möglichkeiten der Funktion .ajax.

Persönlich finde ich die .ajax-Rohfunktion sehr verwirrend und bevorzuge das Laden, Abrufen oder Posten nach Bedarf.

POST hat folgende Struktur:

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

GET hat Folgendes:

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

LOAD hat folgendes:

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

Wie Sie sehen können, gibt es kaum Unterschiede zwischen ihnen, da die Situation bestimmt, welche verwendet werden soll. Müssen Sie die Informationen intern an eine Datei senden? Verwenden Sie .post (dies wäre in den meisten Fällen der Fall). Müssen Sie die Informationen so senden, dass Sie einen Link zu dem bestimmten Moment bereitstellen können? Verwenden Sie .get. Beide ermöglichen einen Rückruf, bei dem Sie die Antwort der Dateien verarbeiten können.

Ein wichtiger Hinweis ist, dass .load auf zwei verschiedene Arten wirkt. Wenn Sie nur die URL des Dokuments Ziel bieten, wird es wirkt als get (und ich sage handeln , weil ich getestet Überprüfung $_POSTim aufgerufenen PHP , während Standard .load Verhalten mit und es erkennt $_POST, nicht $_GET, vielleicht wäre es genauer sein zu sagen, es fungiert als .post ohne Argumente); jedoch als http://api.jquery.com/load/Sobald Sie der Funktion ein Array von Argumenten zur Verfügung gestellt haben, werden die Informationen in die Datei POST. In jedem Fall fügt die .load-Funktion die Informationen direkt in ein DOM-Element ein, das in vielen Fällen sehr gut lesbar und sehr direkt ist. bietet aber dennoch einen Rückruf, wenn Sie mit der Antwort etwas mehr anfangen möchten. Darüber hinaus können Sie mit .load einen bestimmten Codeblock aus einer Datei extrahieren und so einen Katalog beispielsweise in einer HTML-Datei speichern und Teile davon (Elemente) direkt in DOM-Elemente abrufen.



1

Beide werden verwendet, um einige Daten zu senden und eine Antwort mit diesen Daten zu empfangen.

GET : Informationen auf dem Server speichern. (dh Suche, Tweet, Personeninformation). Wenn Sie Informationen senden möchten, erhalten Sie eine Anfrage zum Senden einer Anfrage mit process.php?name=subrotoSo werden Informationen grundsätzlich über die URL gesendet. URL kann nicht mehr als 2036 Zeichen verarbeiten. Kannst du dich daran erinnern, dass es für einen Blog-Beitrag nicht möglich ist?

POST : Post mache dasselbe wie GET. Benutzerregistrierung, Benutzeranmeldung, Big Data senden, Blogpost. Wenn Sie sichere Informationen senden müssen, verwenden Sie Post oder Big Data, da diese nicht über die URL gesendet werden.

AJAX : $.get()und $.post()enthalten Funktionen, die Teilmengen von sind $.ajax(). Es hat mehr Konfiguration.

$.get ()Methode, die eine Art Abkürzung für ist $.ajax(). Wenn $.get ()Sie ein Objekt verwenden, übergeben Sie Argumente, anstatt es zu übergeben. Sie benötigen mindestens die ersten beiden Argumente, nämlich die URL der abzurufenden Datei (z. B. test.txt) und einen erfolgreichen Rückruf.


0

Alle haben das Thema sehr gut erklärt. Es gibt noch einen Punkt, den ich über die .load () -Methode hinzufügen möchte.

Wenn Sie gemäß Dokument laden einen Suffix-Selektor in die Daten-URL einfügen, werden beim Laden von Inhalten keine Skripts ausgeführt.

Arbeitsplunker

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

Auf der anderen Seite werden nach dem Entfernen des Selektors in der URL Skripte in neuen Inhalten ausgeführt. Versuchen Sie dieses Beispiel

nach dem Entfernen von #content in url in der Datei index.html

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

Es gibt keine solche eingebaute Funktion, die von anderen diskutierten Methoden bereitgestellt wird.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.