ترفندفناوری

Jquery چیست و چه کاربردی دارد؟

در مطلب گذشته زبان JavaScript را معرفی کردیم که کارایی فراوانی دارد اما در این مطلب کتابخانه معروف و کاربردی JavaScript که Jquery است را معرفی می کنیم. با ماگرتا همراه باشید …

جی‌کوئری یا Jquery یک کتابخانه جاوااسکریپت سبک وزن چند مرورگری می‌باشد که برای ساده کردن نوشتن اسکریپ‌های سمت-مشتری دراچ تی ام ال (HTML) طراحی شده است.جی کوئری امروزه محبوبترین کتابخانه جاوااسکریپت در حال استفاده است. جی کوئری نرم‌افزار باز متن و رایگان است که تحت دو پروانه GPL و MIT  منتشر می‌شود. دستور زبان جی کوئری به گونه‌ای طراحی شده است که عمل هدایت یه پرونده را آسان تر کرده باشد، بدین صورت که می‌توان حرکات انیمیشین ایجاد کرد و رویدادهایی در صفحه استفاده کند و به وسیله آن می‌توان نرم‌افزارهای مبتنی بر ای‌جکس را ایجاد و توسعه داد.

جی کوئری همچنین این اختیار را به برنامه نویسان می‌دهد که پلاگین هایی برای کتابخانه جاوااسکریپت ایجاد کنند. جدا از این‌ها جی کوئری به توسعه دهندگان این اختیار را می‌دهد که تکه برنامه‌های سطح پایین مبادله‌ای (ارتباط مرورگر با کاربر) و یا انیمیشنی و حتی افکت‌های پیشرفته و سطح بالا و ایجاد اشیا فرضی را ایجاد کنند.

به کارگیری همه این اجزای جی کوئری کمک می‌کند صفحات وب قدرتمند و داینامیک (پویا) داشته باشیم. کتابخانه جی‌کوئری معمولاً تنها یک فایل حاوااسکریپت است که شامل همه DOMها و Eventها و افکت‌های و تابع‌های مربوط به ای‌جکس می‌شود. فایل جی‌کوئری را می‌توان به طرق مختلفی به صفحه وب متصل کرد که در ادامه این روش‌ها را معرفی می‌کنیم.

شعار اصلی Jquery :

Write less, Do more  است. شعار جیکوئری خلاصه ی تفاوت جیکوئری و جاوا اسکریپت است. یعنی با کمترین نوشتن، بیشترین کارها را میتوان با Jquery انجام داد.

jquery vs javascript


کاربرد Jquery در طراحی سایت

در دنیای طراحی وب، تمام وب سایت‌ها و صفحات وب از دو بخش server-side (بخش سرور) و client-side (بخش کاربری) تشکیل شده‌اند. بخش کاربری قسمتی از سایت است که ما می‌توانیم به کمک مرورگرهای مختلف آن را مشاهده کنیم. برای طراحی بخش کاربری سایت از زبان‌های نشانه‌ گذاری مانند HTML، CSS و همچنین از زبان برنامه نویسی جاوا اسکریپت و کتابخانه معروف آن یعنی JQuery استفاده می‌شود. برای درک کاربرد JQuery ابتدا باید آشنایی اولیه با زبان جاوا اسکریپت داشته باشیم.

جی کوئری یک فایل چند کیلوبایتی است، اما همین فایل کوچک، قدرت فوق العاده‌ای دارد و کارهای بسیار زیادی میتوان با آن انجام داد. برای شما با استفاده از Jquery میتوانید :

  • انیمیشن ها و افکت های زیبایی به المان هایتان اضافه کنید. برای مثال وقتی که کاربر روی یک المان کلیک کرد، افکت های مختلفی روی آن اجرا شود.
  • درخواست های Ajax به سمت سرور ارسال کنید و اطلاعات را بدون refresh صفحه از دیتابیس دریافت کنید.
  • تگ های HTML یا محتویات صفحه وب خود را اضافه، حذف، ادیت و… کنید. برای مثال یک تگ  <div> اضافه کنید یا یک تگ <p> حذف کنید یا یک Class یا id خاص را به یک تگ خاص اضافه کنید.
  • اسلایدرهای عکس زیبا بسازید.
  • منوهای باز شونده‌ی زیبا طراحی کنید (مانند منوهای بالای سایت یادیفای که با رفتن موس روی آن‌ها، زیر منوهایی برای شما نمایش داده میشود).
  • به فرم های ثبت نام، ورود و… اعتبار سنجی را اضافه کنید. برای مثال چک کنید که اگر رمز کاربر کمتر از ۸ کاراکتر بود، اجازه‌ی ثبت نام به کاربر داده نشود.
  • و بسیاری کارهای دیگر که میتواند به جذاب شدن صفحات وب شما بسیار کمک کند.


همچنین مطالعه کنید : HTML چیست / CSS چیست / JavaScript چیست .

jquery
jquery


نحوه استفاده از Jquery

۱- روش اول این است که فایل jQuery را از سایت رسمی آن دانلود کنید  و با دستور زیر آن‌را در قسمت تگ <head> فایل HTML خود لود کنید (داخل تگ body هم میتوانید قرار دهید ) :

<head>
<script src="jquery.js"></script>
</head>

۲- روش دوم این است که جی کوئری را از یک شبکه توضیح محتوا یا CDN بارگزاری کنید. برای مثال در کد زیر ما جی کوئری را میتوانیم از سرور های گوگل در کد خود Load کنیم :

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

بعد از اینکار صفحه‌ی شما آماده است و میتوانید کدهای جی کوئری خود را بنویسید و از کار با آن لذت ببرید.


یکی از مرجع های کامل یادگیری Jquery (همچین زبان های برنامه نویسی دیگر) سایت W3SCHOOLS است.

زنجیران

هم‌بنیانگذار ماگرتا ، عاشق دنیای وب و ۷ سالی ست که فعالیت جدی در حوزه اینترنت دارم. تخصص من تولید محتوایی‌ست که مورد نیاز مخاطبان است. مدیر ارشد تیم شبکه های اجتماعی سایت هستم. به قول ماگرتایی‌ها وقت بروز شدنه !

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

3 + 6 =