AJAX Tanıtımı
AJAX bir geliştiricinin hayalidir, çünkü şunları yapabilirsiniz:
- Bir web sunucusundan veri oku - sayfa yüklendikten sonra
- Sayfayı yeniden yüklemeden bir web sayfasını güncelleyin
- Verileri bir web sunucusuna gönderin - arka planda
AJAX Örneği
Let AJAX change this text
AJAX Örnek Açıklaması
HTML Sayfası
<!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>
HTML sayfası bir <div> bölümü ve bir <button> içerir.
<div> bölümü, bir sunucudan gelen bilgileri görüntülemek için kullanılır.
<button> bir işlevi çağırır (eğer tıklanırsa).
İşlev, bir web sunucusundan veri ister ve şunu görüntüler:
İşlev loadDoc()
function loadDoc() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById("demo").innerHTML = this.responseText;
}
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
AJAX nedir?
AJAX = Eşzamanlı bir JavaScript ve X ML .
AJAX bir programlama dili değildir.
AJAX sadece aşağıdakilerin bir kombinasyonunu kullanır:
- Bir tarayıcı yerleşik
XMLHttpRequestnesnesi (bir web sunucusundan veri istemek için) - JavaScript ve HTML DOM (verileri görüntülemek veya kullanmak için)
AJAX yanıltıcı bir isimdir. AJAX uygulamaları, verileri taşımak için XML kullanabilir, ancak verileri düz metin veya JSON metni olarak taşımak da eşit derecede yaygındır.
AJAX, perde arkasında bir web sunucusuyla veri alışverişi yaparak web sayfalarının eşzamansız olarak güncellenmesine olanak tanır. Bu, tüm sayfayı yeniden yüklemeden bir web sayfasının bölümlerini güncellemenin mümkün olduğu anlamına gelir.
AJAX Nasıl Çalışır?
- 1. Bir web sayfasında bir olay meydana gelir (sayfa yüklenir, bir düğmeye tıklanır)
- 2. JavaScript tarafından bir XMLHttpRequest nesnesi oluşturulur
- 3. XMLHttpRequest nesnesi bir web sunucusuna bir istek gönderir
- 4. Sunucu isteği işler
- 5. Sunucu, web sayfasına bir yanıt gönderir
- 6. Yanıt JavaScript tarafından okunur
- 7. Uygun eylem (sayfa güncelleme gibi) JavaScript tarafından gerçekleştirilir
Modern Tarayıcılar (Getirme API'sı)
Modern Tarayıcılar, XMLHttpRequest Nesnesi yerine Fetch API'yi kullanabilir.
Fetch API arayüzü, web tarayıcısının web sunucularına HTTP istekleri yapmasına izin verir.
XMLHttpRequest Nesnesini kullanırsanız, Fetch aynısını daha basit bir şekilde yapabilir.