دوره آموزشیjQuery تمامی مباحث این کتابخانه را در 30 ساعت آموزشی پوشش خواهد داد. در این دوره علاوه بر بررسی تمامی توابع، متدها و خصوصیات jQuery ، مثال های کاربردی در انتهای هر جلسه مرتبط با مطالب ارائه شده در آن، نیز ارائه خواهد شد. روش ساخت پلاگین ها و استفاده از پلاگین های مشهور نیز یکی از مواردی است که در این دوره بررسی می شود.
سرفضل های آموزشی این دوره به شرح زیر می باشند:
بررسی اجمالی کتابخانه های جاوااسکریپت
مزیتهای jQuery
- منبع باز بودن
- مستندات گسترده
- جاوااسکریپت با کدهای کمتر
- زنجیره سازی
- سازگاری با مرورگرها
- مطابقت با CSS
شروع به کار با jQuery
- دریافت jQuery
ساختار اسکریپت های jQuery
- $() جایگزینی برای jQuery()
- آشنایی با مفهوم مجموعه عناصر انتخابی
- تشریح دستورات jQuery
- jQuery بارگذاری صفحه را در دست می گیرد
- مثالی عملی: فهرستی پویا از محتوای صفحه
پیاده سازی صفحه HTML
- نوشتن کدهای jQuery
- تشریح اسکریپت
- دستورات گزینشگر
- متدهای پیمایش DOM
- متدهای دستکاری DOM
- متدهای رویدادها
- متدهای انیمیشن
- متدهای کار با AJAX
- متدهای گوناگون
- پلاگین ها
گزینشگرهای CSS
- گزینشگر نوع دار (T)
- گزینشگر شناسه (#myid)
- گزینشگر کلاس(.myclass)
- اولاد (E F)
- فرزند (E>F)
- هم نوع مجاور (E+F)
- هم نوع مجاور عمومی(E~F)
- گروه بندی (E,F,G)
- فرزندان شماره دار (:nth-child(n/even/odd/expr))
- اولین فرزند (:first-child)
- آخرین فرزند (:last-child)
- تنها فرزند (:only-child)
- نقیض (:not(E))
- تهی (:empty)
- سراسری (*)
- گزینشگرهای صفت
- صفت ([foo])
- صفت معادل ([foo=bar])
- صفت نامساوی ([foo!=bar])
- صفت شروع شونده با مقداری خاص([foo^=bar])
- صفت ختم شونده به مقداری خاص ([foo$=bar])
- صفت شامل ([foo*=bar])
- صفت شامل کلمه خاص ([foo~=bar])
- صفت پیشوندی ([foo|=bar])
- گزینشگرهای form
- گزینشگرهای سفارشی
- عناصر در اندیس مشخص (:eq(n))
- گزینشگر بزرگتر از (:gt(n))
- گزینشگر کوچکتر از (:lt(n))
- گزینشگر اولین (:first)
- گزینشگر آخرین (:last)
- گزینشگر عناصر زوج (:even)
- گزینشگر عناصر فرد (:odd)
- گزینشگر پدر (:parent)
- گزینشگر محتوی متن (:contains(text))
- گزینشگر محتوی عنصر (:has(E))
- گزینشگر :visible
- گزینشگر hidden:
- گزینشگر عنوان (header:)
- گزینشگر animated :
کارگاه
- ایجاد جدوال رنگارنگ
تابع jQuery( )
$( )
- عنصر زمینه گزینشگر
- استفاده از عناصر DOM برای ایجاد اشیاء jQuery
- کپی گرفتن از اشیاء jQuery
- ایجاد عناصر جدید و قرار دادن آن ها در صفحه
- نگاشت چیست؟
متدهای پالایش (فیلتر کردن)
- .filter()
- استفاده از یک تابع در متد .filter()
- .not()
- حذف عناصری خاص
- .has()
- .eq()
- .first()
- .last()
- .slice()
- اندیس منفی
- متدهای پیمایش درخت عناصر
- .find( )
- .children()
- .parents()
- .parentsUntil( )
- .parent( )
- .closest( )
- .offsetParent( )
- .siblings( )
- .next()
- .nextAll([selector])
- .nextUntil( )
- .prev( )
- .prevAll( )
- prevUntil( ) :
متد های گوناگون پیمایش DOM
- .add( )
- .is( )
- .end( )
- .andSelf( )
- .map( )
- .contents( )
کارگاه
- انتخاب همزمان چندین کادر علامت
صفات عمومی
- .attr( ) (بازیاب)
- .attr() (تنظیم گر)
- تنظیم مقدار یک صفت ساده
- تغییر همزمان چندین صفت
- مقدار صفات محاسبه شده
- removeAttr().
دستکاری خواص عناصر
- .prop( ) (بازیاب)
- .prop( ) (تنظیم گر)
- .removeProp( )
دستکاری قواعد سبک
- .css( )(بازیاب)
- .css( )(تنظیم گر)
- height() (بازیاب)
- .height( ) (تنظیم گر)
- .innerHeight( )
- .outerHeight( )
- .width( ) (بازیاب)
- .width( ) (تنظیم گر)
- .innerWidth( )
- .outerWidth()
- .offset() (بازیاب)
- .offset( ) (تنظیم گر)
- .position( )
- .scrollTop( ) (بازیاب)
- .scrollTop( ) (تنظیم گر)
- .scrollLeft() (بازیاب)
- .scrollLeft( ) (تنظیم گر)
- هدایت اسکرول به محل یک عنصر خاص در صفحه
صفتهای کلاس
- .hasClass( )
- .addClass( )
- .removeClass()
- .toggleClass( )
جایگزینی عناصر صفحه
- .html( ) (بازیاب)
- .html( )(تنظیم گر)
- .text( ) (بازیاب)
- .text( ) (تنظیم گر)
- .val( ) (بازیاب)
- .val( ) (تنظیم گر)
- .replaceWith()
- .replaceAll( )
متدهای درج درونی
- .prepend( )
- .prependTo( )
- .append()
- .appendTo()
درج خارجی
- .before( )
- .insertBefore( )
- .after()
- .insertAfter()
درج در اطراف عناصر
- .wrap( )
- .wrapAll( )
- .wrapInner( )
- .clone( )
حذف از DOM
- .empty( )
- .remove( )
- .detach()
- .unwrap( )
کارگاه
- استان ها و شهر ها
- تغییر اندازه دلخواه فونت متون
- ساخت سربرگ ها
ثبت کنترلگرهای رویداد
- .bind( )
- کنترلگرهای رویداد
- شیء event
- ارسال و دریافت داده های رویداد:
.unbind( )
- استفاده از فضاهای نام :
- استفاده از شی event :
.one( )
.trigger( )
.triggerHandler()
.live()
Event delegation :
.die()
رویدادهای مربوط به بارگذاری صفحه
- .ready()
- جایگزینی فضای نام jQuery :
- .load()
- .unload()
- .error()
- .mousedown()
- .mouseup()
- .click()
- .dblclick()
- .toggle()
- .mouseover()
- .mouseout()
- .mouseenter()
- .mouseleave()
- .hover()
- .mousemove()
رویدادهای Form :
- .focus()
- .blur()
- .change()
- .select()
- .submit()
- رویدادهای صفحه کلید:
- .keydown()
- .keypress()
- .keyup()
رویدادهای مرورگر
- .resize()
- .scroll()
کارگاه
- یک کشیدن و رها کردن ساده:
- Event Propagation
- تفاوت های mouseenter و mouseover
- تفاوت های mouseleave و mouseout
- نمایش مختصات نشانگر ماوس در صفحه
- تشخیص دکمه ای از ماوس که فشارداده شده است
- منوهای شناور
- حذف و اضافه پویای عناصر فرم
افکتهای پیش ساخته
- .show()
- .hide()
- .toggle()
- .slideDown()
- .slideUp()
- .slideToggle()
- .fadeIn()
- .fadeOut()
- .fadeTo()
افکت (انیمیشن)های سفارشی
- .animate()
- .stop()
- .delay()
- .queue()
- .dequeue()
- .clearQueue()
کارگاه
- منوی شناور متحرک سازی شده
- منوی پیمایش عمودی چندسطحی
- منوی پیمایش افقی چندسطحی
- منوی Accordion عمودی
- منوی Accordion افقی
متدهای سطح پایین
- $.ajax()
- شیء jqHR:
- توابع پاسخگو:
- انواع داده ها :
- ارسال داده ها به سرور از طریق AJAX
- خواص پیشرفته :
- .$.ajaxSetup()
متدهای میانبر برای کار با AJAX
- $.get()
- .load()
بار گذاری بخش های خاصی از صفحه:
- .$.post()
- .$.getJSON()
- JSON چیست ؟
- .$.getScript()
کنترلگرهای رویداد عمومیAJAX
- .ajaxComplete()
- .ajaxError()
- . ajaxSend()
- .ajaxStart()
- .ajaxStop()
- .ajaxSuccess()
توابع کمکی در AJAX
- .serialize ()
- .serializeArray()
کارگاه
- تصدیق کاربران
- بارگذاری پویای کدهای HTML
- وارد کردن بخش های خاصی از صفحه
- استفاده از Auto Complete
- دریافت نام هایی که توسط پایگاه داده تولید میشوند
- استان ها و شهرها با پایگاه داده
متدهای راه اندازی
- $.noConflict()
- $.sub()
متدهای مربوط به عناصر DOM
- .size()
- .get ()
- .index()
متدهای دستکاری مجموعه ها
- .each ()
- $.grep ()
- $.makeArray()
- $.inArray()
- $.map()
- $.merge()
- $.unique()
- $.extend()
- $.trim()
- $.param()
تشخیص انواع:
- $.isArray()
- $.isFunction()
- $.isPlainObject()
- $.isEmptyObject()
- $.isXMLDoc()
- .data()
- .removedata()
کارگاه :
- ایجاد کادر راهنمای ساده
خواص سراسری:
- $.browser
- $.support
- $.support.boxModel :
- $.support.cssFloat :
- $.support.hrefNormalized :
- $.support.htmlSerialize :
- $.support.leadingWhitespace :
- $.support.noCloneEvent :
- $.support.objectAll :
- $.support.opacity :
- $.support.scriptEval :
- $.support.style :
- $.support.tbody :
- .length
- .selector
- .context
استفاده از پلاگین ها:
ایجاد یک پلاگین:
- متد شیء
- توابع سراسری:
- پلاگین های تک تابعه:
- پلاگین های چند تابعه:
- مثال : یک تابع ساده برای چاپ
- دستورات گزینشگر
- قرارداد های پلاگین ها
- استفاده از $
- قوانین نامگذاری
- استاندارد سازی
آماده سازی پلاگین ها
- استفاده از پلاگین snowfall برای بارش برف در صفحه:
- افزودن کادرهای راهنمای دلخواه با پلاگین Hovertip
- اعتبار سنجی فرم ها با استفاده از پلاگین validate :
- ایجاد فیلدهای فرمت بندی شده با پلاگین Masked Input
- نمایش سرخط آخرین اخبار با پلاگین news Ticker
- ارسال فرم به روش Ajax با jQuery Form Plugin
- .ajaxForm()
- .ajaxSubmit()
- formSerialize
- fieldSerialize
- fieldValue
- resetForm()
- clearForm()
- clearFields
- نمایش اسلایدی تصاویر و محتوا با EasySlider
- پلاگین Cycle