آموزش صفر تا صد جی کوئری (فیلم+دانلود رایگان PDF)
بعد از حدود ۱ هفته گشت و گذار در اینترنت و از بین هزاران ویدیو، یک مجموعه بی نقص و کامل ویدیویی را برای یادگیری سریع jQuery گلچین کرده ایم. این مجموعه کامل برای شروع از صفر و برای همه سطوح مناسب می باشد. بعد از آن نیز بهترین جزوه PDF فارسی موجود در اینترنت را جهت تکمیل یادگیری می توانید دانلود کنید.
۱-توضیحاتی راجب jQuery
جِیکوئری (به انگلیسی: jQuery) یک کتابخانه جاوا اسکریپت سبکوزنِ چند مرورگری است که برای ساده سازیِ نوشتنِ اسکریپ هایِ سمت-مشتری یا به عبارتی سمت Client، در صفحات وب طراحی شده و امروزه محبوبترین کتابخانهٔ جاوااسکریپتِ در حال استفاده است.
جی کوئری نرمافزار متنباز و رایگان است که تحت پروانه “MIT” منتشر میشود. ساختار کتابخانه جِیکوئری به گونهای طراحی شدهاست که دسترسی به عناصر صفحه را آسانتر کرده باشد. میتوان با آن حرکات انیمیشن ایجاد و از رویداد (به انگلیسی: Event) های صفحه استفاده کرد و به وسیله آن میتوان نرمافزارهای مبتنی بر ایجکس (به انگلیسی: Ajax) را ایجاد و توسعه داد.
جیکوئری همچنین این اختیار را به برنامه نویسان میدهد که افزونههایی برای این کتابخانه جاوااسکریپت ایجاد کنند. جدا از اینها، جیکوئری به توسعه دهندگان این اختیار را میدهد که تکه برنامههای سطحِ پایینِ مبادلهای (ارتباط مرورگر با کاربر) یا انیمیشنی و حتی افکتهای پیشرفته و سطح بالا و اشیاء فرضی را ایجاد کنند. بهکارگیری همهٔ این اجزای جیکوئری کمک میکند تا صفحات وب قدرتمند و داینامیک (پویا)، راحتتر ایجاد شوند. (ویکی)
داشتن دستورات بسیار ساده و قابل درک در زمینه بکارگیری ای جکس (AJAX) یکی از کاربرد های مهم جی کوئری می باشد. به طوری که می توانید یک طراحی سایت را با کمک Jquery به صورت ful AJAX طراحی کنید.
۲-موارد آموزش داده شده در این پکیج
- جی کوئری چیست؟
- کاربردها و مبانی اصلی
- معرفی محیط جی کوئری
- رویداد Document Ready
- معرفی و کد نویسی Window Load & Window Unload
- Selectors
- و …
۳- نمونه آموزش
۴-دانلود آموزش اول
حجم: ۵۵۰ مگابایت
سطح: از صفر تا صد
نسخه آموزش داده شده: مناسب برای همه نسخه ها
جاوا، جاوا اسکریپت رو قورت بده! بدون کلاس، سرعت 2 برابر، ماندگاری 3 برابر، پولسازی عالی با توسعه وب، ماشین لرنینگ و ... کتابخانه های پیشرفته جاوا اسکریپت و ... دانلود:
به دنبال یادگیری سریع تر، حرفه ای تر، کامل تر و با کیفیت فول اچ دی هستید؟ بهترین پکیج آموزش جی کوئری موجود در ایران را ببینید!
5- دانلود آموزش دوم
اگر به هر دلیلی اموزش اول (شماره 4) را دوست نداشتید یا با متد آموزش راحت نبودید می توانید از این آموزش استفاده کنید یا هر دو را باهم. این آموزش از پیج گرفته شده است. به شخصه پیشنهاد میکنم آموزش اول را حتما دانلود و استفاده کنید و بعد بیاین سراغ این آموزش چون این آموزش در 3 جلسه 20 دقیقه ای، دستورات و موارد گفته شده در آموزش اول رو بصورت پروژه ای کار میکنه و موارد اصول اولیه که در اموزش اول گفته شده رو نداره و فقط برای تکمیل یادگیری:
جلسه اول
جلسه دوم
جلسه سوم
6-نکات و ترفندهای فوق العاده مهم و کاربردی جی کوئری
متوجه شدیم که jQuery یک کتابخانه جاوا اسکریپت است که کار با HTML، CSS و DOM را سادهتر و سریعتر میکند. این کتابخانه همچنین به مدیریت رویدادها، انیمیشنها و تعاملات AJAX کمک میکند. در اینجا راهنمایی برای شروع کار با jQuery به همراه نکات و اصطلاحات مهم آورده شده است:
۱. افزودن jQuery به پروژه
برای استفاده از jQuery، میتوانید فایل آن را از وبسایت رسمی jQuery دانلود کنید یا از لینک CDN استفاده کنید.
استفاده از CDN
افزودن jQuery به پروژه HTML با استفاده از CDN:
<!DOCTYPE html><br><html lang="en"><br><head><br> <meta charset="UTF-8"><br> <meta name="viewport" content="width=device-width, initial-scale=1.0"><br> <title>My jQuery Project</title><br> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><br></head><br><body><br> <h1>Hello, jQuery!</h1><br> <script><br> $(document).ready(function() {<br> alert("jQuery is working!");<br> });<br> </script><br></body><br></html><br>
دانلود فایل jQuery
میتوانید فایل jQuery را دانلود کرده و در پروژه خود اضافه کنید:
<!DOCTYPE html><br><html lang="en"><br><head><br> <meta charset="UTF-8"><br> <meta name="viewport" content="width=device-width, initial-scale=1.0"><br> <title>My jQuery Project</title><br> <script src="path/to/your/jquery.min.js"></script><br></head><br><body><br> <h1>Hello, jQuery!</h1><br> <script><br> $(document).ready(function() {<br> alert("jQuery is working!");<br> });<br> </script><br></body><br></html><br>
۲. اصول اولیه jQuery
jQuery از طریق نماد $
به تمامی عناصر HTML دسترسی پیدا میکند. ساختار اولیه برای اطمینان از بارگذاری کامل DOM به این صورت است:
$(document).ready(function() {<br> // کدهای jQuery شما اینجا قرار میگیرد<br>});<br>
۳. انتخاب عناصر (Selectors)
jQuery انتخاب عناصر HTML را بسیار ساده میکند. برخی از مثالهای انتخاب عناصر عبارتند از:
-
انتخاب تمامی عناصر با یک تگ خاص:
$("p") // انتخاب تمامی پاراگرافها<br>
- انتخاب یک عنصر با شناسه خاص:
$("#myId") // انتخاب عنصر با شناسه myId<br>
- انتخاب عناصر با کلاس خاص:
$(".myClass") // انتخاب تمامی عناصر با کلاس myClass<br>
۴. تغییر محتوای HTML و CSS
با jQuery میتوانید محتوای HTML و استایلهای CSS را به راحتی تغییر دهید:
-
تغییر محتوای یک عنصر:
$("#myId").html("New Content"); // تغییر محتوای عنصر با شناسه myId<br>
- تغییر استایلهای CSS:
$(".myClass").css("color", "red"); // تغییر رنگ متن تمامی عناصر با کلاس myClass به قرمز<br>
اصطلاحات کلیدی جی کوئری که باید بلد باشید
- (selector)$ انتخابگر jQuery که برای انتخاب عناصر HTML استفاده میشود.
- ()ready. تابعی که اطمینان حاصل میکند که DOM به طور کامل بارگذاری شده است.
- ()html. تابعی برای دریافت یا تغییر محتوای HTML یک عنصر.
- ()css. تابعی برای دریافت یا تغییر استایلهای CSS یک عنصر.
- ()click. تابعی برای مدیریت رویداد کلیک.
- ()hide(), .show. توابعی برای پنهان کردن و نمایش عناصر.
- ()fadeIn(), .fadeOut. توابعی برای ایجاد افکتهای محو شدن.
- ()slideDown(), .slideUp. توابعی برای ایجاد افکتهای اسلاید.
- ()get(), $.post.$ توابعی برای ارسال درخواستهای AJAX.
با دانلود دروس بالا نیازی به مورد دیگری در زمینه این برنامه ندارید و از این به بعد فقط بایستی به صورت پروژه ای کار کنید و تجربه کسب نمایید. همه دستورات را بلدید!هر گونه سوالی در زمینه این مطلب دارید در بخش نظرات مطرح کنید تا به آن پاسخ دهیم.