آموزش JQuery

9 / 10
از 7 کاربر

در این چند سال آخیر اینترنت چهره ی پویا و داینامیک به خود گرفته است و کاربران و طراحان سایت را وادار به استفاده از ابزار های مختلف با استاندارد بالا برای طراحی سایت و کارکردشان کرده است. طراحان سایت از ابزار هایی مانند JQuery برای خودکار شدن عملیات مشترک، زیبایی و ساده سازی عملکرده ها ساتفاده می کنند. از جمله دلایل استفاده فراوان JQuery  دست شما را در انجام طیف گسترده ای از عملیات باز می کند. اما اصلا پیش خود فکر نکنید که یاد گیری آن دشوار و سخت است چرا که از ساختار های HTML و   CSSساخته شده است.

( برای مشاهده مقالات آموزشHTML  و آموزشCSS  کلیک کنید.)

می توان گفت JQuery  یکی از پایه های  طراحی سایت می باشد. تکنولوژی JQuery یکی از زیر شاخه های جاوا اسکریپت می باشد. جان رزیگ مخترع جی کوئری می باشد و تا کنون در تیم جی کوئری در حال توسعه و به روز رسانی می باشد. به همین دلیل است که تمامی کد ها Jquery درجاوا اسکریپت قابل باز نویسی است. اما تفاوت ویژه ای که Jquery با جاوا اسکریپت دارد Write less , Do more است یکی با نوشتن کمترین کد کار های بیشتری میتوانید انجام دهید. 

Administrator\files\UploadFile\jQuery-Plugin-To-Create-Terminal-style-Typing-Effects-TypeWriting-js.jpg

در این بخش از مقالات شرکت طراحی سایت مبنا می خواهیم به آموزش سر فصل های زیر بپردازیم:

  •  مقدمات آموزش JQuery
  • رویداد ها در جی کوئری (Events)
  • افکت ها در جی کوئری (JQuery Effects)
  • HTML و CSS در جی کوئری
  • ایجکس و جی کوئری (jQuery AJAX)
  • توابع متفرقه در JQuery
  • مرجع JQuery

اگر آموزش Jquery به صورت حرفه اعمال شود و به صورت حرفه ای پیاده سازی شود میتواند یکی از بزرگترین حسن های یک طراحی سایت باشد.شما می توانید با آموزش Jquery صفحات زیبا و کاربر پسندتری را ایجاد کنید و با استفاده از تکنیک Ajax به سایت خود سرعت ببخشید.
برای آموزش Jquery ابتدا باید یک سری تعاریف را برای شما بازگو کنیم:
• Jquery چیست؟
• چرا Jquery بهتر از دیگر ابزار هاست؟
• نصب Jquery و راه اندازی جی کوئری
• قواعد دستوری Jquery
• انتخاب گرها در جی کوئری  (Jquery Selectors)
• رویداد ها در جی کوئری (Jquery Events)

Administrator\files\UploadFile\jquerys.jpg

Jquery چیست؟

jQuery (جی کوئری) یک کتابخانه ای از جاوا اسکریپت است که اسناد HTML (اچ تی ام ال) را به سادگی پیمایش می کند وهمچنین مدیریت و رسیدگی به رویدادها، متحرک سازی، تعاملات Ajax (آجاکس) برای سرعت دادن به توسعه وب را آسان می سازد.

در واقع Jquery یک چارچوب جاوا اسکریپت (java Script) است که هدف از خلق آن آسانسازی جاوا اسکریپت برای استفاده در طراحی سایت است.

برای استفاده از جی کوئری آن را باید به صورت یک لایه انتزاعی تعریف کنیم چرا که اکثر قابلیت هایی را که برای استفاده آن ها چندین خط باید کد نویسی میکردیم را در یک قالب به نام functions (توابع) قرار داده است که ما را قادر می سازد قط در یک خط کد آن قابلیت را فراخوانی کنیم.

لازم به ذکر است که نمیتوان از Jquery به عنوان جایگزینی برای جاوا اسکریپت استفاده کنیم زیرا بعضی از کد های میانبر طریقه نوشتاری را در اختیارمان میگزارد در واقع باز هم از کد های جاوا اسکریپت استفاده میکنیم.

Administrator\files\UploadFile\keep_calm_and_use_jquery_by_cisoxp-d4x2q73.jpg

این مقالات آموزش Jquery ، شرکت طراحی سایت مبنا سعی بر آن دارد که بیشتری از دستورات جاوا اسکریپت را (مانند فراخوانی Ajax و عملیات DOM را ساده و آسان نماید تا کاربر بتواند با کمترین دانش و علمی راجع به جاوا اسکریپت بتواند قابلیت های مورد نیازش را ایجاد نماید. به طوری که قادر خواهید بود برای هر کاری یک پلاگین Jquery دریافت کنید.

چرا Jquery بهتر از دیگر ابزار هاست؟

در این اواخر با فراگیر شدن آموزش HTML باعث شده است که استفاده و کاربرد پکیج های framework جاوا اسکریپت بیشتر شود. این پکیج ها شامل عملیتی مانند کار های انیمیشنی را آسان سازی می کند اما Jquery تلاش بر آن دارد تا پوشش همه جانبه ای داشته باشد.

برای آن که شما بتوانید تغییراتی در صفحات و طراحی سایت خود ایجاد کنید لازم است بر کد ها ی مربروط بهCSS و ... تسلط و یا آشنایی داشته باشید اما با استفاده از ابزار Jquery طراحی سایت دیگر به آن دشواری نخواهد بود.

پشتیبان های Extension در Jquery به صورتی تنظیم شده است که می توان به راحتی پلاگین های را حذف یا اضافه کرد همچنین ساختار Jquery به نحوی صورت گرفته است که در زمان دانلود برای دیگر اجزای صفحه وب سایت قابل شناسایی است و نتها با استفاده از ماژول ها آسان و ساده میتوان تغییراتی ایجاد کرد.

یکی از معضلات طراحان در طراحی وب سایت عدم هماهنگی مابین مررورگرها و نرم افزارهای جدید است اما این مشکل شامل Jquery نمی شود چرا که با هر مرورگری سازگاری دارد.

Implicit Iteration این امکان را به شما می دهد که به بررسی همه ی لوپ ها بپردازید و وقت خود را بخرید.

Administrator\files\UploadFile\jquerytools.jpg

نصب Jquery

برای آن که بتوانید از همه ی امکانات موجود درjquery  استفاده کنیم باید از سایت jquery.com  آخرین نسخه jquery  را دانلود کنیم.

Administrator\files\UploadFile\site jquery.png

در این مقاله از مقالات طراحی سایت سه راه اصلی دانلود را به شما آموزش می دهدیم:

Minified: یک فایل فشرده شده به حجم 15 کیلوبایت است و سریع لود میشود. از این فایل بیشتر برای استفاده تجاری ایجادبهره میبرند.

Uncompressed: یک فایل عادلی و غیر فشرده می باشد و حجمی حدود 94 کیلو بایت دارد که از آن برای آموزش و یادگیری استفاده میشود.

Packed: فایلی با حجم 29 کیلوبایت ، یک فایل زیپ فشرده نشده است.

حال شما می توانید آن فایل کتابخانه را در صفحات خود راه اندازی و نصب کنید.

به دو طریق inline و external میتوان Jquery را نصب کرد.همچنین نحوه کد نویسی به دو روش صورت امکان پذیر می باشد:

Inline: توصیه میشود که از این روش کمتر استفاده کنید زیرا کد نویسی در همان صفحه ای انجام میشود که میخواهیم در آن jquery را فراخوانی کنیم.

External: در این روش ابتدا یک فایل با پسوند" .js " ایجاد میکنید و در داخل آن فایل مشغول به کد نویسی میشوید و در هر صفحه ای که بخواهید از کد های jquery استفاده کنید آن فایل را در آن صفحه فرا میخوانید.

لطفا شرکت طراحی سایت مبنا را از نظرات، پیشنهادات  انتقادات سازنده خود مطلع سازید.

ارسال نظر و نظرات ثبت شده
علی :
0 0
سلام خسته نباشید . چرا ادامه اموزش بقیه قسمتهارو قرار ندادین.
freshta :
0 1
بسیار یک وب سایت زیبای آموزشی است تشکر
مدیریت : سپاس از سپاسگذاریتون
رضا :
0 0
سلام مرسی از مطالب مفیدتون.من html و css و jquery و‌بلدم و در حد مبتدی java script بلدم. بنظر شما ورپرس بخونم بهتره یا اینکه چیزایی که خوندمو تقویت کنم؟
مدیریت : سلام و درود و سپاس. همان مطالب را تقویت کنید و پیاده سازی با asp را یاد بگیرید.