استخدام jQuery مع AJAX




تحتوي لغة jQuery على مكتبة غنية من الطرائق و الأكواد الوظيفية functions من أجل التطوير مع لغة AJAX .

مثال

دع أجاكس يقوم بتغيير المحتوى







تم استدعاء المثال السابق من خلال دورة AJAX و لكن تم تعديله مع لغة jQuery .




ماهي لغة AJAX؟


لغة AJAX هي اختصار Asynchronous JavaScript And XML أي تداخل الجافاسكربت مع xml والتي تعني أجاكس .

ان لغة الأجاكس AJAX ليست لغة برمجية جديدة ولكن طريقة جديدة لاستخدام المعايير الحالية .

تبادل لغة AJAX البيانات مع السيرفر وتقوم بتحديث جزء من صفحة الويب بدلاً من تحميل الصفحة كلها .

بعض الأمثلة التي تستخدم الأجاكس AJAX هي : Google Maps و Gmail و Youtube و Facebook وغيرها .

إن أردت البدء بتعلم لغة AJAX يمكنك زيارة دورة AJAX .




AJAX و jQuery


تحتوي لغة jQuery على مكتبة غنية من الطرائق و الأكواد الوظيفية functions من أجل التطوير مع لغة AJAX .

باستخدام jQuery مع AJAX يمكنك طلب بيانات من ملفات TXT و HTML و XML و JSON ومن خلال السيرفر باستخدام أوامر HTTP Get و HTTP Post .

كما يمكنك تحميل بيانات مباشرة الى عناصر و أماكن معينة على صفحتك الانترنت .




قلّ ما تكتب كثيراً ما تفعل


تعتبر الطريقة load() طريقة بسيطة ولكنها فعالة جداً من طرائق AJAX functions . تتكون من التركيبة التالية :
$(selector).load(url,data,callback)


استخدم المنتقى selector لتحديد عناصر HTML التي تود تغييرها و أيضاً الرابط url لتحديد عنوان الموقع لبياناتك .

فقط اذا أردت ارسال البيانات الى السيرفر ستحتاج الى الكود data . وأيضاً اذا أردت تغيير كود وظيفي function بعد الانتهاء يمكنك استخدام callback .




مستوى منخفض من AJAX

يعتبر الكود $.ajax(options) هو التركيبة الأساسية للأكواد الوظيفية functions في المستوى المنخفض من AJAX .

تقدم $.ajax فعالية أكثر وسلاسة أكثر من الأكواد الوظيفية ذات المستوى المرتفع مثل load و get و post وغيرها الا أنه أيضاً من الصعب استخدامها .

تقدم الخيارات مجموعة من الاسماء name و القيم value وذلك بتعريف url و data و passwords و data types و filters و character sets و timeout و error functions . أي تقوم بتعريف الرابط و البيانات و كلمات المرور و نوع البيانات و التصفية و ضبط الأحرف و انتهاء الوقت و الأخطاء البرمجية .



















طرائق jQuery مع AJAX
الطلبالشرح
$(selector).load(url,data,callback)تحميل بيانات الى العناصر المحددة
$.ajax(options)تحميل بيانات الى كائن XMLHttpRequest


ليست هناك تعليقات:

إرسال تعليق