XML HttpRequest

همه مرورگرهای مدرن یک مستند XMLHttpRequest داخلی دارند که برای درخواست داده‌ها از سرور استفاده می‌شود.

مستند XMLHttpRequest

مستند XMLHttpRequest می‌تواند برای درخواست داده‌ها از سرور وب استفاده شود.

مستند XMLHttpRequest یکرویای توسعه‌دهندگان، زیرا شما می‌توانید:

  • صفحه وب را به‌روزرسانی کنید - بدون بارگذاری مجدد صفحه
  • داده‌ها را از سرور درخواست کنید - پس از بارگذاری صفحه
  • داده‌ها را از سرور دریافت کنید - پس از بارگذاری صفحه
  • داده‌ها را به سرور ارسال کنید - در پس‌زمینه

مثال XMLHttpRequest

وقتی که شما در فیلد ورودی زیر حروفی تایپ می‌کنید، XMLHttpRequest به سرور ارسال می‌شود و چندین پیشنهاد نام (از سرور) بازمی‌گرداند:

مثال

لطفاً نام خود را در فیلد ورودی زیر وارد کنید:

نام: پیشنهادات: در فصل AJAX این درس، مثال بالا توضیح داده شده است.

XMLHttpRequest ارسال کنید

زبان JavaScript معمولی استفاده شده برای XMLHttpRequest به شرح زیر است:

مثال

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    اگر (این.readyState == 4 && این.status == 200) {
       // عمل معمولی که باید زمانی که مستند آماده است انجام شود:
       document.getElementById("demo").innerHTML = xhttp.responseText;
    }
};
xhttp.open("GET", "filename", true);
xhttp.send();

آزمایش کنید

توضیح مثال

در اولین خط مثال بالا یک مستند XMLHttpRequest:

var xhttp = new XMLHttpRequest();

onreadystatechange ویژگی تعیین می‌کند که کدام فراخوانی باید هر بار که XMLHttpRequest به حالت خود تغییر کند، اجرا شود:

xhttp.onreadystatechange = function()

وقتی که readyState ویژگی 4 است و status وقتی که ویژگی 200 است، پاسخ آماده است:

اگر (این.readyState == 4 && این.status == 200)

responseText ویژگی‌ها به صورت رشته‌ی متن به سرور پاسخ داده می‌شوند.

رشته‌های متن می‌توانند برای به‌روزرسانی وب‌سایت استفاده شوند:

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

شما در فصل AJAX این آموزش خواهید آموخت که چگونه از آبجکت XMLHttpRequest استفاده کنیم.