AJAX - Sunucu yanıtı
- Önceki Sayfa AJAX İstekleri
- Sonraki Sayfa AJAX XML Dosyası
Kurs tavsiyesi:
readyState
onreadystatechange özelliği
onreadystatechange
özellik XMLHttpRequest'nin durumunu tutar.
status
özellik, readyState değiştiğinde yürütülecek fonksiyonu tanımlar. Http Mesaj Referans Kılavuzu
Özellik ve
Özellik | Açıklama |
---|---|
onreadystatechange | Özellik, XMLHttpRequest nesnesinin durumunu tutar. |
readyState |
readyState özelliği değiştiğinde çağrılacak fonksiyonu tanımlar.
|
status |
404: "Sayfa bulunamadı" Tam liste için ziyaret edin |
Http Mesaj Referans Kılavuzu | statusText |
dönüş durum metni döndürür (örneğin "OK" veya "Not Found") Her zaman
readyState değişdiğinde onreadystatechange fonksiyonu çağrılır. readyState
için 4
vestatus
için 200
içindeyken, yanıt hazır hale gelir:
Örnek
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(); };
Açıklama:onreadystatechange
beş kez tetiklenir (0-4), her seferinde readyState
tümü değişiyor.
Geri çağrı fonksiyonlarını kullanarak
Geri çağrı fonksiyonu, bir başka fonksiyona parametre olarak geçirilen bir fonksiyondur.
Eğer web sitenizde birden fazla AJAX görevi varsa, bir XMLHttpRequest nesnesi oluşturmak için bir fonksiyon ve her AJAX görevi için bir geri çağrı fonksiyonu oluşturmalısınız.
Bu fonksiyon, URL'yi ve yanıtı alındığında çağrılacak fonksiyonu içermelidir.
Örnek
loadDoc("url-1", myFunction1); loadDoc("url-2", myFunction2); function loadDoc(url, cFunction) { var xhttp; xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { cFunction(this); }; }; xhttp.open("GET", url, true); xhttp.send(); }; function myFunction1(xhttp) { // Burada eylem yapılır }; function myFunction2(xhttp) { // Burada eylem yapılır };
Sunucu yanıtı özellikleri
Özellik | Açıklama |
---|---|
responseText | Dizgi biçimindeki yanıtı almak |
responseXML | XML veri biçimindeki yanıtı almak |
Sunucu yanıtı yöntemi
Yöntem | Açıklama |
---|---|
getResponseHeader() | Sunucudan belirli başlık bilgilerini döndürür |
getAllResponseHeaders() | Sunucudan tüm başlık bilgilerini döndürür |
responseText özelliği
responseText
Özellik, yanıtı JavaScript stringi olarak döndürür, bu yüzden böyle kullanabilirsiniz:
Örnek
document.getElementById("demo").innerHTML = xhttp.responseText;
responseXML özelliği
XMLHttpRequest nesnesi bir yerleşik XML ayrıştırıcıya sahiptir.
ResponseXML
Özellik, yanıtı XML DOM nesnesi olarak döndürebilir.
Bu özelliği kullanarak, yanıtı XML DOM nesnesi olarak döndürebilirsiniz:解析 etmeXML DOM nesnesi için:
Örnek
istek dosyası music_list.xmlve yanıtı解析 etme:
xmlDoc = xhttp.responseXML; txt = ""; x = xmlDoc.getElementsByTagName("ARTIST"); for (i = 0; i < x.length; i++) { txt += x[i].childNodes[0].nodeValue + "<br>"; }; document.getElementById("demo").innerHTML = txt; xhttp.open("GET", "music_list.xml", true); xhttp.send();
Bu eğitim bölümünde XML DOM hakkında daha fazla bilgi öğreneceksiniz.
getAllResponseHeaders() Methodu
getAllResponseHeaders()
Method, sunucudan gelen yanıtta tüm başlık bilgilerini döndürür.
Örnek
var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.getAllResponseHeaders(); }; };
getResponseHeader() Methodu
getResponseHeader()
Method, sunucudan gelen yanıtta belirli başlık bilgilerini döndürür.
Örnek
var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.getResponseHeader("Last-Modified"); }; }; xhttp.open("GET", "ajax_info.txt", true); xhttp.send();
- Önceki Sayfa AJAX İstekleri
- Sonraki Sayfa AJAX XML Dosyası