Ajax steht dort oben auf den wichtigsten Gründen für die Verwendung von jQuery ziemlich weit oben. JQuery behebt nicht nur die browserübergreifenden Probleme, sondern macht die Syntax auch sehr einfach zu verwenden und zu verstehen.
In diesem Video versuchen wir zu erklären, was Ajax überhaupt ist. Wir betrachten ein Formularelement, das beim Senden eine GET- oder POST-Anforderung (wie durch das Methodenattribut bestimmt) an die von Ihnen angegebene URL (wie durch das Aktionsattribut bestimmt) ausführt. Das ist nur HTML, dort passiert überhaupt kein Backend-Code oder JavaScript. Diese Übermittlung führt jedoch dazu, dass sich die Seite ändert und buchstäblich unter der neuen URL neu geladen wird, genau wie beim Klicken auf einen Link.
Mit Ajax können wir diese GET- oder POST-Anfrage im Hintergrund stellen, ohne die Seite neu laden zu müssen. Im Kern ist das der ganze Punkt von Ajax. Und es ist sehr mächtig. Es ist maßgeblich dafür verantwortlich, warum moderne Websites so funktionieren und sich so anfühlen, wie sie es tun.
Ajax stand früher für asynchrones JavaScript und XML, aber das wird heutzutage weitgehend ignoriert, da es nicht viel bedeutet. Auch daher die Entkapitalisierung. Manchmal wird auch "XHR" angezeigt, was für XMLHttpRequest, die native Kerntechnologie von Ajax, steht.
Der Unterschied zwischen GET und POST besteht im Wesentlichen darin, dass GET zum Abrufen von Informationen dient und nicht für das Ändern von Daten verantwortlich sein sollte. POST dient speziell zum Ändern von Daten. Lesen Sie dazu mehr in diesem StackOverflow-Thread.
Das Erstellen einer GET-Anfrage in jQuery ist erstaunlich einfach:
$.get( "URL", function(data) ( // do something with data )); ));Über die URL möchten Sie die Daten abrufen. Der zweite Parameter ist die Rückruffunktion, die ausgeführt wird, wenn die Ajax-Anforderung erfolgreich war. Der wichtigste Parameter dort ist der erste, Daten, der die Informationen enthält, die er von der Anfrage erhalten hat.
Ajax-Anfragen können manchmal fehlschlagen. Ein Grund für diesen Fehler könnte der Browser selbst und seine Sicherheitsrichtlinien sein. In den Browsern selbst sind Regeln enthalten, nach denen Inhalte angefordert werden können. Anfragen können immer an dieselbe Domain gestellt werden, von der die Anfrage stammt. Wenn es sich jedoch um eine andere Domäne handelt, muss diese andere Domäne dies speziell zulassen.
Sie können alles darüber auf enable-cors.org lesen. CORS steht für "Cross-Origin Resource Sharing". Wir sehen uns ein Beispiel an, in dem CORS nicht aktiviert ist und die Ajax-Anforderung fehlschlägt. Eine standardmäßige und einfache Möglichkeit, dies zu beheben, besteht darin, einen Header festzulegen, der CORS über die .htaccess-Datei ermöglicht, vorausgesetzt, der Server ist Apache.
Header set Access-Control-Allow-Origin "*"Im Video verschieben wir einfach die Ajax-Anforderung auf CodePen, der Ajax standardmäßig gut verarbeitet.
Einfach kitschig:
Siehe den Stift fBInl von Chris Coyier (@chriscoyier) auf CodePen