XML HttpRequest

Alle moderne browsere har indbygget XMLHttpRequest-objekt, der bruges til at anmode om data fra serveren.

XMLHttpRequest-objekt

XMLHttpRequest-objektet kan bruges til at anmode om data fra en webserver.

XMLHttpRequest-objektet erUdviklerens drøm, fordi du kan:

• Opdater webstedet - uden at genindlæse siden
• Forespørg data fra serveren - efter siden er indlæst
• Modtag data fra serveren - efter siden er indlæst
• Send data til serveren - i baggrunden

XMLHttpRequest eksempel

Når du indtaster tegn i nedenstående inputfelt, sendes en XMLHttpRequest til serveren, og nogle navneforslag returneres (fra serveren):

Eksempel

Indtast venligst navnet i nedenstående inputfelt:

Send XMLHttpRequest

Her er den almindelige JavaScript-syntaks, der bruges med XMLHttpRequest-objektet:

Eksempel

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    hvis (this.readyState == 4 && this.status == 200) {
       // Typisk handling, der skal udføres, når dokumentet er klar:
       document.getElementById("demo").innerHTML = xhttp.responseText;
    }
}
xhttp.open("GET", "filename", true);
xhttp.send();

Prøv det selv

Eksempel Forklaring

Det første linje i det ovennævnte eksempel opretter et XMLHttpRequest-objekt:

var xhttp = new XMLHttpRequest();

onreadystatechange egenskaben specificerer hvilken funktion, der skal køres hver gang XMLHttpRequest-objektets tilstand ændres:

xhttp.onreadystatechange = function()

når readyState egenskaben er 4 og status Når egenskaben er 200, er responsen klar:

hvis (this.readyState == 4 && this.status == 200)

responseText Egenskaber returneres som tekststreng fra serverens respons.

Tekststreng kan bruges til at opdatere websiden:

document.getElementById("demo").innerHTML = xhttp.responseText;

Du vil lære mere om XMLHttpRequest objektet i AJAX kapitlet af denne tutorial.