آشنایی مختصر با jQuery

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

فریم‌ورک چیست!؟

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

jQuery چیست!؟

در یک کلام، jQuery یک کتابخانه جاوا اسکریپت است که انجام یک سری کارها را برای شما بسیار آسان می‌کند و همچنین یک سری امکانات از پیش آماده شده را به شما اراده می‌دهد.

jQuery چکار می کند؟

زبان برنامه نویسی JavaScript ، یک زبان برنامه نویسی خیلی پیچیده و گسترده است و یادگیری کامل آن به زمان و حوصله خیلی زیادی نیاز دارد. jQuery فریم‌ورکی که بر اساس زبان برنامه نویسی جاوا اسکریپت ایجاد شده است. به زبان ساده می‌توان گفت، برنامه نویس با استفاده از زبان برنامه نویسی جاوا اسکریپت، یک سری قائده و قانون تعریف کرده است و یک دستور زبان جدید ساخته که شما با آن قواعد یه کد به مراتب بسیار ساده‌تر می‌نویسید، سپس آن فایل فریم‌ورک دستورات شما را به دستورات استاندارد جاوا اسکریپت ترجمه می کند و سپس آن ها را اجرا می‌کند. همراه با یک مثال ساده، توضیح بیشتر ارائه می‌شود:

مثلا زبان فارسی را در نظر بگیرید که بسیار گسترده است. حال ما درنظر داریم یه کتاب کوچک بنویسم و برای 2000 لغت پرکاربرد زبان فارسی علامت های اختصاری در نظر بگیریم، به عنوان مثال برای لغت «در» یک معادل در نظر می‌گیریم:

در = ^-^

با این علامت های اختصاری ما می توانیم کلمات و جملات خاصی را به صورت خیلی مختصیر و مفید بنویسیم. حال اگر یک متن را با این علامت های اختصاری بنویسیم و آن کتاب مرجع را نیز در اختیار شخص ثالثی قرار دهیم، آن شخص می تواند علامت ها را دیده و با مراجعه به کتاب مرجع، متن اصلی را مشاهده کنید. کار JQuery هم در واقع به همین صورت است. جی کوئری یک فایل javascript چند هزار خطی هست که در آن یک سری کارهایی که طراحان وب با جاوا اسکریپت انجام میدادند را، خلاصه کرده است. به عنوان مثال برای مخفی کردن یک DIV کافی است که به اندازه یک نیم خط کد بنویسم (در حالی که قبلا باید ده‌ها خط کد جاوا اسکریپت برای این کار نوشته می‌شد) خود فایل JQuery در واقع حکم همان کتاب مرجع را دارد. به همین خاطر است که اگر شما فایل اصلی جی کوئری را به صفحه لینک نکنید و دستورات خودتان را بر اساس قوانین جی کوئری بنویسید، اتفاقی نمی‌افتد و در واقع دستوران برای شما کار نخواهند کرد. (چون در این حالت دستورات هست ولی کتاب مرجع نیست که مرورگر وب بفهمد هر دستور چه معنایی می‌دهد) البته باید در نظر داشت که خود فریم ورک‌ها هم محدودیت دارند، چون کل یک زبان برنامه نویسی را پوشش نمی‌دهند و یا گاها سنگین هستند (چون مثلا ما به همه توابع داخل یه فریم‌ورک احتیاجی نداریم (در مورد مثال کتاب مرجع هم ممکن است کسی به همه 2000 لغت احتیاجی نداشته باشد)

در استفاده از JQuery ما دو تا فایل خواهیم داشت:

- یک فایل، خود فایل JQuery می‌باشد که باید در ابتدا به صفحه مورد نظر ما لینک شود.
- فایل دوم فایل JS ای هست که دستورات ما بر اساس قوانین Jquery داخلش نوشته شده است. (البته می‌تواند این دستورات را در داخل کدهای صفحه نیز قرار داد و یک فایل جداگانه نداشت)

jQuery نوعی عملکرد چند منظوره و مشترک برای انجام عملیات جاوا اسکریپت در اختیار کاربر می گذارد. ماهیت بالنده و دایما در حال رشد jQuery (به دلیل افزوده شدن دائمی پلاگین‌های مختلف به آن) چنان است که تشریح فواید استفاده از آن، در یک مقاله ممکن نباشد. اما میتوان مختصری درباره ویژگی‌های کلیدی jQuery در زیر اشاره کرد:

- ایجاد امکان دسترسی به بخشهایی از یک صفحه بدون نیاز به ابزارهای جاوا اسکریپت و عدم نیاز به کد نویسی های زیاد.

- جی کوئری مکانیسم سریع و موثری برای جستجو ، یافتن و انتخاب بخشهای مورد نظر از یک صفحه را بدون نیاز به ابزار جاوا اسکریپت، در اختیار ما قرار میدهد.

- امکان تغییر ظاهر یک صفحه؛ البته CSS ابزار قدرتمندی در تغییر صفحات بما میدهد اما قادر به انجام اینکار در مرورگرهای مختلف که استانداردهای متفاوتی دارند، نیست. اما جی کوئری براحتی میتواند هر نوع مرورگری را ساپورت کند و حتی قادر است که مختصات ویژه صفحات وب را، حتی بعد از دستکاری و تغییر ساختاری و ظاهر، دوباره تغییر دهد.

- جی کوئری نه تنها تغییرات ظاهری و ناچیز را، بلکه صرفا با چند کلیک ساده، می‌تواند محتوای صفحات مورد نظر کاربر را هم تغییر کلی بدهد و مثلا متن یا عکسی را تغییر داده و یا تصویر یا لیستی را درون متنهای آن صفحه اضافه و یا از آن حذف کند. حتی میتواند تمام ساختار HTML صفحات را کاملا تغییر دهد.

- یکی از امکانات کتابخانه جی کوئری کنترل و جلوگیری از اتفاقات غیرمنتظره ایست که بهنگام کلیک کردن یک کاربر بر یک لینک رخ میدهند و مثلا باعث کند شدن یا درهمریختگی مرورگرها میشوند. ابزار event-handler در جی کوئری این وظیفه را بسادگی و بدون نیاز به استفاده از جاوا اسکریپت انجام میدهد.

- افزودن انیمیشن (Fade) به یک صفحه؛ کسب فیدبک از (یا به) کاربران، امری بسیار مهم است و جی کوئری این ویژگی را بسادگی با استفاده از امکاناتی همچون Fade و غیره بما میدهد.

- کسب طالاعات از یک سرور بدون نیاز به ریفرش کردن آن صفحه (که اصطلاحا به آن AJAX می‌گویند) جی کوئری اینکار را بدون نیاز به دانستن مختصات ویژه هر سرور و صرفا با مراجعه مستقیم به نتایج آن صفحه (محتویات سرور) انجام میدهد.

- ساده سازی عملکردهای مشترک / تکراری جاوا اسکریپت : جی کوئری علاوه بر انجام بسیار ساده تغییرات کلی در متن و ظاهر صفحات وب، حتی قادر به ساده تر کردن عملیات ساختار سازی همچون Iteration And Array Manipulation هم هست.

آیا jQuery نوآوری‌های خاصی هم داشته است؟

بله، در زیر به چند مورد اشاره می‌شود؛

- کد نویسی بر اساس دستور زبانی که jQuery ایجاد کرده، خیلی ساده است و در کمترین تعداد خط می‌توان بیشترین تغییرات را در صفحه ایجاد کرد.

- جی کوئری کاملا Unobtrusive می‌باشد یعنی شما هیچ کد جاوا اسکریپتی را داخل کدهای XHTML وارد نمی کنید. از این نظر کدهای شما کاملا مجزا از هم و مرتب خواهد بود و از طرفی وقتی JS روی مرورگر فعال باشد، کدهای شما اجرا میشود ولی اگر JS فعال نباشد، هیچ مشکلی برای سایت شما پیش نمی‌آید و سایت همچنان برای کاربر قابل استفاده خواهد بود.

- در jQuery تگها را میتوان بر اساس همان قواعد CSS انتخاب نمود.

به عنوان مثال وقتی می‌خواهیم یه تگ a را که داخل یه div با آیدی amir می‌باشد، انتخاب کنیم، به این صورت عمل می‌کنیم:

div.amir a {
....
}

به عنوان مثال همین تگ a را در داخل jQuery به این صورت انتخاب می‌کنیم:

$(document).ready(function() {
$("div.amir a")
});

- هر مرورگر به یک شکل کدهای JS را تفسیر میکند. جی کوئری محیطی را فراهم کرده است که شما اصلا ذهنتان مشغول این قضیه نشود و مطمئن باشید که کدی که می‌نویسید در همه مرورگرها و IE نسخه 6 به بعد به درستی کار خواهد کرد.

چرا jQuery بهتر از سایر ابزارها است؟

در سالهای اخیر افزایش گرایش به HTML باعث افزایش کارایی پکیج های Framework های جاوا اسکریپتی شده، بعضی پکیج ها عملیات خاص و محدود و بعضی دیگر کارهای انیمیشن و غیره را تسهیل می کنند. اما جی کوئری سعی می کند تا تمام این حوزه ها را پوشش دهد؛

- ارایه و شناسایی و تغییر مختصات صفحات وب، متضمن آشنایی طراحان وب با کدها و خطاهای مربوط به CSS و ... است ولی جی کوئری این کار را برای طراحان آسانتر نموده است.

- ساپورت های Extension در جی کوئری طوری تنظیم شده اند که پلاگینها را میتوان بسادگی اضافه یا حذف نمود و ساختار درونی Basic jQuery طوری نوشته شده که بهنگام دانلود براحتی برای سایر آیتم های صفحه وب قابل شناسایی اند و براحتی با ایجاد ماژول‌های ساده میتوان تغییرشان داد.

- یکی از مشکلات طراحی و طراحان وب همانا متفاوت بودن پیش شرط ها و مختصات مرورگرها و عدم هماهنگی آنها با یکدیگر و یا با نرم افزار های جدید است. جی کوئری قادر است که با هر مرورگری کار کرده و با کاهش کدها و ساده سازی کار را آسانتر کند.

- با استفاده از تکنیک Implicit Iteration قادر خواهید بود که بسیاری از لوپ ها را بصورت دسته جمعی (و نه تک به تک) بررسی و در وقت صرفه جویی کرده و بدین ترتیب نیاز به کدنویسی طولانی نداشته باشید.

- jQuery از متد برنامه نویسی خاصی بنام Chaining برای تک خطی کردن فرمان‌ها استفاده میکند، بهمین دلیل ما دیگر نیازی به تکرار فرمانها و ماژولها نداریم.

- این استراتژیها باعث کاهش کدها و کمپرس شدن کل پکیج jQuery به تقریبا 20KB شده اما در عین حال تمامی نیازهای کاربر را هم برطرف میسازد.

دانلود jQuery

برای دانلود جی کوئری و کسب اطلاعات بیشتر راجع به این کتابخانه مفید جاوا اسکریپت کافی است به سایت رسمی آن سری بزنید و براحتی آن را دانلود نمایید. www.jquery.com