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

AJAX المقدمة

❮ السابق التالي الفصل ❯

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

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

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

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

AJAX مثال

Let AJAX change this text

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

AJAX وأوضح مثال

صفحة HTML

<!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 على <div> القسم و <button> .

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

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

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

وظيفة loadDoc()

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();
}

ما يجب أن تعرفه إذا

قبل المتابعة يجب أن يكون فهم أساسي للما يلي:

  • HTML
  • جافا سكريبت

إذا كنت ترغب في دراسة هذه المواضيع أولا، والعثور على الدروس على موقعنا على الصفحة الرئيسية .

ما هي AJAX ؟

AJAX = غير متزامن جافا سكريبت وإكس إم إل.

أجاكس هو اسم مضلل. قد تستخدم تطبيقات أجاكس XML لنقل البيانات، ولكن من الشائع أيضا على نقل البيانات كنص عادي أو نص JSON.

أجاكس هي تقنية لإنشاء صفحات الويب بسرعة وديناميكية.

أجاكس تسمح صفحات الويب ليتم تحديثه بشكل متزامن من خلال تبادل كميات صغيرة من البيانات مع الخادم وراء الكواليس. وهذا يعني أنه من الممكن لتحديث أجزاء من صفحة على شبكة الإنترنت، دون إعادة تحميل الصفحة بأكملها.

صفحات الويب الكلاسيكية، (التي لا تستخدم أجاكس) يجب إعادة تحميل الصفحة بأكملها إذا كان المحتوى يجب أن يتغير.

أمثلة على التطبيقات التي تستخدم أجاكس: خرائط جوجل و Gmail، يوتيوب، والفيسبوك.

كيف أجاكس الأشغال

أجاكس

واستنادا أجاكس على معايير الإنترنت

أجاكس هو بناء على معايير الإنترنت، ويستخدم مزيجا من:

  • XMLHttpRequest كائن (لاسترداد البيانات من خادم الويب)
  • JavaScript/DOM (لعرضهم / استخدام البيانات)

XMLHttpRequest هو اسم مضلل. لم يكن لديك لفهم XML لاستخدام أجاكس.

خدمة Google Suggest

وجاء أجاكس شعبية في عام 2005 من قبل جوجل، مع خدمة Google Suggest.

غوغل اقتراح تستخدم أجاكس لإنشاء واجهة ويب ديناميكية جدا: عند البدء في الكتابة في مربع بحث Google، وجافا سكريبت يرسل رسائل باتجاه آخر إلى الخادم وإرجاع الملقم قائمة من الاقتراحات.

بدء استخدام أجاكس اليوم

ويستند أجاكس على المعايير الحالية. وقد استخدمت هذه المعايير من قبل المطورين لعدة سنوات. قراءة الفصول المقبلة التي قمنا بها لنرى كيف يعمل!


❮ السابق التالي الفصل ❯