XML HttpRequest

Kursrekommendationer:

XMLHttpRequest-objekt

Alla moderna webbläsare har inbyggda XMLHttpRequest-objekt för att begära data från servern.

XMLHttpRequest-objektet kan användas för att begära data från en webbserver.XMLHttpRequest-objektet ärUtvecklarens dröm

  • eftersom du kan:
  • Uppdatera webbsida - utan att ladda om sidan
  • Förfråga data från servern - efter att sidan har laddats
  • Ta emot data från servern - efter att sidan har laddats

Skicka data till servern - i bakgrunden

XMLHttpRequest-instans

Nedan är vanlig JavaScript-syntax för att använda XMLHttpRequest-objekt:

När du skriver tecken i följande inmatningsfält skickas en XMLHttpRequest till servern och returnerar några förslag på namn (från servern):

Vänligen ange namn i följande inmatningsfält: Namn: Förslag:

I AJAX-kapitlet i denna tutorial förklaras ovanstående exempel.

Skicka XMLHttpRequest

Nedan är vanlig JavaScript-syntax för att använda XMLHttpRequest-objekt:

var xhttp = new XMLHttpRequest();
Exempel
    xhttp.onreadystatechange = function() {
       om (this.readyState == 4 && this.status == 200) {
       document.getElementById("demo").innerHTML = xhttp.responseText;
    // Typisk åtgärd som ska utföras när dokumentet är redo:
}
}
xhttp.open("GET", "filename", true);

xhttp.send();

Försök själv

Det första raden i föregående exempel skapar ett XMLHttpRequest-objekt:

var xhttp = new XMLHttpRequest();

onreadystatechange egenskapen specificerar vilken funktion som ska köras varje gång XMLHttpRequest-objektets tillstånd ändras:

xhttp.onreadystatechange = function()

när readyState egenskapen är 4 och status När egenskapen är 200, är responsen redo:

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

responseText Egenskaper returneras som textsträngar från serverns svar.

Textsträngar kan användas för att uppdatera webbsidor:

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

Du kommer att lära dig mer om XMLHttpRequest-objektet i AJAX-kapitlet i denna tutorial.