با عرض سلام و وقت بخیر خدمت کاربران سایت پی وی لرن ، با یکی دیگر از جلسات دوره کامل آموزش JavaScript در خدمت شما دوستان هستیم . در این جلسه به معرفی و آموزش Ajax می پردازیم تا پایان این جلسه با ما همراه باشید.
Ajax یک زبان برنامه نویسی نیست. بلکه تکنیکی برای دسترسی به سرور از یک صفحه وب است.
Ajax مخفف Asynchronous JavaScript And XML
در Ajax شما می توانید کار های زیر را انجام دهید:
در مثال زیر هنگامی که روی دکمه کلیک می کنیم، محتوا تغییر می کند:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <!DOCTYPE html> <html> <body> <div id="demo"> <h2>The XMLHttpRequest Object</h2> <button type="button" onclick="loadDoc()">Change Content</button> </div> <script> 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(); } </script> </body> </html> |
کد HTML مثال فوق :
1 2 3 4 5 6 7 8 9 10 11 | <!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> یک تابع را فراخوانی می کند (اگر کلیک شده باشد).
این تابع اطلاعات را از یک سرور وب درخواست می کند و آن را نمایش می دهد:
1 2 3 4 5 6 7 8 9 10 | 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(); } |
AJAX از ترکیب زیر استفاده می کند:
نکته: AJAX یک نام گمراه کننده است. برنامه های Ajax ممکن است که از XML برای انتقال داده ها استفاده کنند، اما انتقال داده با استفاده از متن ساده یا JSON نیز رایج است.
Ajax این امکان را به صفحه وب می دهد تا یکپارچه توسط مبادله داده ها یا یک سرور در پشت صحنه بروز رسانی شود.
این بدین معنی است که می توانید بخش هایی از صفحه را بدون بارگذاری مجدد کل صفحه بروز کنید.
۱- یک رویداد در صفحه وب رخ می دهد
۲- یک شی XMLHttpReques توسط جاوا اسکریپت ایجاد می شود
۳- شی XMLHttpRequest یک درخواست را به وب سرور ارسال می کند
۴- سرور درخواست را پردازش می کند
۵- سرور پاسخی به صفحه وب ارسال می کند
۶- پاسخ سرور توسط جاوا اسکریپت خوانده می شود
۷- عمل مناسب توسط جاوا اسکریپت انجام می شود
جلسه معرفی تکنولوژی Ajax و آموزش Ajax در جاوا اسکریپت JavaScript نیز به پایان رسید.
در جلسه بعد به آموزش شی XMLHttpRequest خواهیم پرداخت. با ما همراه باشید.
علیرضا
خوبه ولی ورداشتید درس های w3 رو ترنسلیت کردید گذاشتید؟!!!!
خب یکم اگر خودتون تسلط داشتین مطلب رو توضیح میدادید خیلی بهتر بود تا ترنسلیت کردن
پی وی لرن
سلام
دوست عزیز، متاسفانه این امکان وجود ندارد این مطالب به صورت آنلاین و رایگان قرارداده شده است و برای تالیف این آموزش ها زمان زیادی صرف شده است اگر توجه کرده باشید بیشتر کتاب های آموزشی تالیفی هستند و از این بابت کسی به مولف خرده نمی گیرد، ما این مطالب را در قالب ویدیو هم بیان کردیم که یک درصد هم ترجمه نیست و فقط تجربه و تخصص است می توانید در دوره آموزش طراحی وب ما ثبت نام نمایید.
علیرضا
خیلی ممنون بابت پاسخگوییتون، بله توی دوره طراحی وب هم شرکت کردم والان هم دارم دوره رو میگذرونم و خیلی هم تشکر میکنم بابت دره با کیفیت و مدرس فوق العاده مسلط اقای مهندس دینی عزیز
پی وی لرن
خوشحالیم که در این دوره شرکت کردید و رضایت دارید و خوشحال می شویم که نظر خودتان را در بخش نظرات دوره طراحی وب هم قرار دهید.