Wie kann ich AJAX-Anrufe ohne jQuery tätigen?

AJAX-Aufrufe ohne jQuery tätigen

In der heutigen Webentwicklungslandschaft ist AJAX zu einer entscheidenden Technik zur Verbesserung der Benutzererfahrung geworden. Während jQuery den Prozess des Tätigens von AJAX-Aufrufen vereinfacht, ist es wichtig zu verstehen, wie man sie mit Vanilla-JavaScript ausführt.

Ein Ansatz zum Tätigen eines AJAX-Aufrufs ohne jQuery ist die Verwendung des XMLHttpRequest (XHR)-Objekts. Hier ist ein Beispiel:

function loadXMLDoc() {
    var xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) { // XMLHttpRequest.DONE == 4
           if (xmlhttp.status == 200) {
               document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
           }
           else if (xmlhttp.status == 400) {
              alert('There was an error 400');
           }
           else {
               alert('something else other than 200 was returned');
           }
        }
    };

    xmlhttp.open("GET", "ajax_info.txt", true);
    xmlhttp.send();
}

In diesem Skript erstellen wir ein XMLHttpRequest-Objekt und richten einen Ereignis-Listener für das readystatechange-Ereignis ein. Wenn die Anfrage abgeschlossen ist (Bereitschaftsstatus ist 4), überprüfen wir den Statuscode und führen basierend auf dem Ergebnis entsprechende Aktionen aus.

jQuery bietet eine präzisere Möglichkeit, AJAX-Aufrufe durchzuführen, wie hier zu sehen:

$.ajax({
    url: "test.html",
    context: document.body,
    success: function() {
      $(this).addClass("done");
    }
});

Dieses Skript verwendet die jQuery-Methode $.ajax() und bietet so mehr Flexibilität und Lesbarkeit des Codes. Es ist jedoch wichtig zu beachten, dass jQuery von der Einbindung der jQuery-Bibliothek abhängt, während der Vanilla-JavaScript-Ansatz in den meisten modernen Browsern nativ funktioniert.

Das obige ist der detaillierte Inhalt vonWie kann ich AJAX-Anrufe ohne jQuery tätigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!