امروزه دنياي وب محيطي ديناميک است و کاربران از استانداردهاي بالايي براي طراحي و عملکرد سايتهايشان استفاده ميکنند. طراحان هم از ابزار مختلف جاوا اسکريپت منجمله jQuery براي اتوماسيون عملکردهاي مشترک، جذابيت و ساده سازي عملکردهاي پيچيده بهره ميبرند. يکي از دلايل محبوبيت استفاده از jQuery قابليت آن در کمک طيف وسيعي از عمليات مختلف است. به همين دليل ممکن است فکر کنيد که پس يادگيري jQuery بايد مشکل باشد اما اين سيستم صرفا تشکيل شده است از يکسري ايده هاي فرض گرفته شده از ساختار HTML و CSS است.
[size=12pt]فریمورک چیست!؟[/size]
فریمورک در اصل محیطی است که برای یک زبان برنامه نویسی خاص ایجاد میشود و شما از آن محیط استفاده می کنید تا کار برایتان آسانتر شود.
[size=12pt]jQuery چیست!؟[/size]
در یک کلام، jQuery یک کتابخانه جاوا اسکریپت است که انجام یک سری کارها را برای شما بسیار آسان میکند و همچنین یک سری امکانات از پیش آماده شده را به شما اراده میدهد.
[size=12pt]jQuery چکار مي کند؟[/size]
زبان برنامه نویسی 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 هم هست.
[size=12pt]آیا jQuery نوآوریهای خاصی هم داشته است؟[/size]
بله، در زیر به چند مورد اشاره میشود؛
- کد نویسی بر اساس دستور زبانی که jQuery ایجاد کرده، خیلی ساده است و در کمترین تعداد خط میتوان بیشترین تغییرات را در صفحه ایجاد کرد.
- جی کوئری کاملا Unobtrusive میباشد یعنی شما هیچ کد جاوا اسکریپتی را داخل کدهای XHTML وارد نمی کنید. از این نظر کدهای شما کاملا مجزا از هم و مرتب خواهد بود و از طرفی وقتی JS روی مرورگر فعال باشد، کدهای شما اجرا میشود ولی اگر JS فعال نباشد، هیچ مشکلی برای سایت شما پیش نمیآید و سایت همچنان برای کاربر قابل استفاده خواهد بود.
- در jQuery تگها را میتوان بر اساس همان قواعد CSS انتخاب نمود.
به عنوان مثال وقتی میخواهیم یه تگ a را که داخل یه div با آیدی amir میباشد، انتخاب کنیم، به این صورت عمل میکنیم:
[ltr]
div.amir a {
....
}
[/ltr]
به عنوان مثال همین تگ a را در داخل jQuery به این صورت انتخاب میکنیم:
[ltr]
$(document).ready(function() {
$("div.amir a")
});
[/ltr]
- هر مرورگر به یک شکل کدهای JS را تفسیر میکند. جی کوئری محیطی را فراهم کرده است که شما اصلا ذهنتان مشغول این قضیه نشود و مطمئن باشید که کدی که مینویسید در همه مرورگرها و IE نسخه 6 به بعد به درستی کار خواهد کرد.
[size=12pt]چرا jQuery بهتر از ساير ابزارها است؟[/size]
در سالهاي اخير افزايش گرايش به HTML باعث افزايش کارايي پکيج هاي Framework هاي جاوا اسکريپتي شده، بعضي پکيج ها عمليات خاص و محدود و بعضي ديگر کارهاي انيميشن و غيره را تسهيل مي کنند. اما جی کوئری سعي مي کند تا تمام اين حوزه ها را پوشش دهد؛
- ارايه و شناسايي و تغيير مختصات صفحات وب، متضمن آشنايي طراحان وب با کدها و خطاهاي مربوط به CSS و ... است ولی جی کوئری اين کار را براي طراحان آسانتر نموده است.
- ساپورت هاي Extension در جی کوئری طوري تنظيم شده اند که پلاگینها را ميتوان بسادگي اضافه يا حذف نمود و ساختار دروني Basic jQuery طوري نوشته شده که بهنگام دانلود براحتي براي ساير آيتم هاي صفحه وب قابل شناسايي اند و براحتي با ايجاد ماژولهاي ساده ميتوان تغييرشان داد.
- يکي از مشکلات طراحي و طراحان وب همانا متفاوت بودن پيش شرط ها و مختصات مرورگرها و عدم هماهنگي آنها با يکديگر و يا با نرم افزار هاي جديد است. جی کوئری قادر است که با هر مرورگري کار کرده و با کاهش کدها و ساده سازي کار را آسانتر کند.
- با استفاده از تکنيک Implicit Iteration قادر خواهيد بود که بسياري از لوپ ها را بصورت دسته جمعي (و نه تک به تک) بررسي و در وقت صرفه جويي کرده و بدين ترتيب نياز به کدنويسي طولاني نداشته باشيد.
- jQuery از متد برنامه نويسي خاصي بنام Chaining براي تک خطي کردن فرمانها استفاده ميکند، بهمين دليل ما ديگر نيازي به تکرار فرمانها و ماژولها نداريم.
- اين استراتژيها باعث کاهش کدها و کمپرس شدن کل پکيج jQuery به تقريبا 20KB شده اما در عين حال تمامي نيازهاي کاربر را هم برطرف ميسازد.
دانلود jQuery
برای دانلود جی کوئری و کسب اطلاعات بیشتر راجع به این کتابخانه مفید جاوا اسکریپت کافی است به سایت رسمی آن سری بزنید و براحتی آن را دانلود نمایید. [مهمان/کاربر گرامی برای دیدن لینک ها ابتدا باید عضو سایت شوید و لاگین کنید برای ثبت نام اینجا کلیک کنید]
منبع:
- بخشیهایی از کتاب Learning JQuery ترجمه شده توسط اکبر.ش
- امیرعباس عبدالعلی
