أحدث البرامج التعليمية وتطوير الشبكة
 

AJAX البرنامج التعليمي


أجاكس هو حلم المطور، لأنك يمكن أن:

  • تحديث صفحة ويب دون إعادة تحميل الصفحة
  • طلب البيانات من الخادم - بعد تحميل الصفحة
  • تلقي البيانات من الخادم - بعد تحميل الصفحة
  • إرسال البيانات إلى الخادم - في الخلفية

انها محاولة لنفسك أمثلة في كل فصل

في كل فصل، يمكنك تعديل الأمثلة على شبكة الإنترنت، وانقر على زر لعرض النتيجة.

أجاكس مثال

Let AJAX change this text

انها محاولة لنفسك »


وأوضح أجاكس مثال

صفحة HTML

<!DOCTYPE html>
<html>
<body>

<div id="demo"><h2>Let AJAX change this text</h2></div>

<button type="button" onclick="loadDoc()">Change Content</button>

</body>
</html>

تحتوي صفحة HTML على <div> القسم و <button> .

و <div> يستخدم القسم لعرض المعلومات من الخادم.

و <button> يدعو وظيفة (إذا تم النقر عليه).

وتطلب وظيفة البيانات من خادم ويب ويعرض ما يلي:

وظيفة loadDoc ()

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
     document.getElementById("demo").innerHTML = xhttp.responseText;
    }
  };
  xhttp.open("GET", "ajax_info.txt", true);
  xhttp.send();
}

البدء في تعلم أجاكس الآن!