Was ist AJAX?
AJAX ist der Traum eines jeden Entwicklers, denn Sie können:
- Daten von einem Webserver lesen - nachdem eine Webseite geladen wurde
- Aktualisieren Sie eine Webseite, ohne die Seite neu zu laden
- Senden Sie Daten an einen Webserver - im Hintergrund
AJAX-Beispiel
Let AJAX change this text
AJAX-Beispiel erklärt
HTML-Seite
<!DOCTYPE html>
<html>
<body>
<div id="demo">
<h2>Let AJAX change this text</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>
</body>
</html>
Die HTML-Seite enthält einen <div>-Abschnitt und einen <button>.
Der Abschnitt <div> wird verwendet, um Informationen von einem Server anzuzeigen.
Der <button> ruft eine Funktion auf (wenn er angeklickt wird).
Die Funktion fordert Daten von einem Webserver an und zeigt sie an:
Funktion loadDoc()
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
Was ist AJAX?
AJAX = Ein synchrones JavaScript und XML . _
AJAX ist keine Programmiersprache.
AJAX verwendet nur eine Kombination aus:
- Ein im Browser integriertes XMLHttpRequest-Objekt (um Daten von einem Webserver anzufordern)
- JavaScript und HTML DOM (um die Daten anzuzeigen oder zu verwenden)
AJAX ist ein irreführender Name. AJAX-Anwendungen verwenden möglicherweise XML zum Transportieren von Daten, aber es ist ebenso üblich, Daten als Klartext oder JSON-Text zu transportieren.
AJAX ermöglicht die asynchrone Aktualisierung von Webseiten, indem hinter den Kulissen Daten mit einem Webserver ausgetauscht werden. Das bedeutet, dass es möglich ist, Teile einer Webseite zu aktualisieren, ohne die ganze Seite neu zu laden.
Wie AJAX funktioniert
- 1. Ein Ereignis tritt auf einer Webseite auf (die Seite wird geladen, eine Schaltfläche wird angeklickt)
- 2. Ein XMLHttpRequest-Objekt wird von JavaScript erstellt
- 3. Das XMLHttpRequest-Objekt sendet eine Anfrage an einen Webserver
- 4. Der Server verarbeitet die Anfrage
- 5. Der Server sendet eine Antwort zurück an die Webseite
- 6. Die Antwort wird von JavaScript gelesen
- 7. Die richtige Aktion (wie Seitenaktualisierung) wird von JavaScript durchgeführt
Vollständiges AJAX-Tutorial
Dies war eine kurze Beschreibung von AJAX.
Ein vollständiges AJAX-Tutorial finden Sie unter W3Schools AJAX Tutorial .
Weitere AJAX-Beispiele finden Sie unter W3Schools AJAX-Beispiele .