[h=2][/h] قدرت و سرعت در دستان JQuery این روز ها دنیای وب و اینترنت مدام در حال تغییر است و هر روز فناوری جدیدی عرضه می شود. دنیای وب سایت ها و وبلاگ ها نیز از این تغییرات مستثنی نیستند و با ورود تکنولوژی 0.2 Web تغییرات زیادی را در طراحی و پیاده سازی سایت ها و وبلاگ ها مشاهده می کنیم. جاوا اسکریپت ابزار های زیادی هستند که یک طراح وب می تواند با اتکا به آنها یک سایت بر پایه تکنولوژی وب دو خلق کند ، یکی از این ابزار ها استفاده از زبان جاوااسکریپت در صفحه های یک سایت است. جاوا اسکریپت یک زبان سمت سرویس گیرنده (کلاینت ساید) است ، از این رو برای اجرای این زبان چنانچه تنها مرورگر وب شما قابلیت اجرای این زبان را داشته باشد کافی است. به عبارتی برای اجرای دستورات مرتبط با این زبان، سرور اشغال نمی شود و تمام دستورات بر روی رایانه کاربران بارگذاری و اجرا می شوند. یک طراح وب با استفاده از جاوا اسکریپت می تواند به صفحه روح ببخشد و بازدید کننده را تشویق کند تا بیشتر از صفحه مورد نظر بازدید کرده و وقت بیشتری را به آن اختصاص دهد.شاید فراگیری و استفاده از جاوا اسکریپت به تنهایی برای مبتدی ها و کسانی که می خواهند به صورت مقدماتی با آن کار کنند ، کمی سخت باشد اما هدف از طراحی برنامه ها و زبان های جدید این است که بتوانیم برنامه ای بسازیم که علاوه بر قدرت و عملکرد بالا از سرعت بالایی نیز در پاسخگویی و اجرای دستورات برخوردار باشد ، از این رو توسعه دهندگان این زبان به فکر یافتن راهکاری جدید برای آسانتر ساختن کار با این زبان افتاده اند. کالبد را بشناسیم با وجود توصیفات بالا ، مفهموم فریم ورک (Framework) در زبان جاوا اسکریپت به وجود آمد. فریم ورک ها در برنامه های دیگر نیز به یاری برنامه نویسان می آیند و کار آنها را ساده تر می کنند. فریم ورک را می توان مجموعه ای از ابزار های کاربردی ، کتابخانه های مورد نیاز و روش های دیگر دانست که انجام وظایف اصلی و مهم را بر عهده می‌گیرند و آنها را به سوی مدلی کامل تر سوق می‌دهند که این کار باعث می‌شود تا باز هم بتوانیم از آن ابزار ها استفاده کنیم. قدرت و سرعت همانطور که قبلا هم اشاره شد در برنامه نویسی باید به دو نکته توجه خاصی داشت : • 1- قدرت انجام کار • 2- سرعت پاسخگویی در انجام وظایف از این رو فریم ورک های مختلف و گوناگونی توسط توسعه دهندگان جاوا اسکریپت ارائه شده است که معروف ترین و پرکاربرد ترین آنها عبارتند ازJQuery ،Prototype ،MooTools و فریم‌ورک معروف یاهو که YUI نام دارد . بر اساس آمار و نظرات طراحان وب،JQuery از محبوبیت بیشتری در میان طراحان وب برخوردار است و اگر می خواهید این گفته به شما ثابت شود ، پیشنهاد می کنیم به ساختار سایت های جدیدی که طراحی شده اند نگاهی بیندازید! در کد نویسی هر فریم ورک نحوه و ساختار خاصی وجود دارد که اگر با جی کوئری آشنایی داشته باشید ، می توانید به سادگی به این نکته پی ببرید. اما شاید این سوال برای شما پیش آمده باشد که چرا جی کوئری در این مدت کوتاه توانسته است موفقیت خوبی را در میان رقبای خود کسب کند و چگونه توجه طراحان و برنامه نویسان وب را به خود جلب کرده است؟ جواب این سوال ساده است! قبلا هم اشاره کردیم که هدف از ارائه فریم ورک های جدید به دست آوردن سرعت بالا و در عین حال قدرت کامل در انجام وظایفی است که طراح یا برنامه نویس به آنها نیازمند است. به این نکته توجه داشته باشید که حجم کد نویسی نیز یکی دیگر از فاکتور های مورد نظر برای انتخاب بهترین فریم ورک است چرا که اگر بتوانیم با نوشتن چند خط کد به هدف مورد نظرمان برسیم و برنامه را اجرا کنیم به موفقیت بزرگی دست پیدا کرده ایم. جی کوئری امروزه به بهترین راه حل برای ساده کردن برنامه نویسی های حرفه ای و پیچیده تبدیل شده است و حتی سایت های بزرگ و معروفی چون یاهو و گوگل نیز در بخش هایی از ساختار سایت خود به دفعات از این فریم ورک جاوا اسکریپت استفاده کرده اند. ادامه دارد...... منبع:روزنامه جام جم
پاسخ : Jquery را بشناسید معرفی JQuery در مقاله قبل توضیحات مختصری در مورد وب 2 و ابزار های مورد نیاز جهت طراحی و پیاده سازی یک سایت وب دویی ارائه کردیم ، در مورد زبان جاوااسکریپ و انواع فریم ورک های که تحت این زبان ارائه شده اند نیز توضیح دادیم. چند مورد از معروفترین فریم ورک های جاوا اسکریپت معرفی شدند و توضیحات مختصری درباره آنها داده شد و دلایل انتخاب jQuery به عنوان قدرتمندترین فریم ورک حال حاضر جاوا اسکریپ ارائه شد که همین دلایل باعث انتخاب jQuery برای معرفی و آموزش در این بخش می باشند. اما در ادامه می خواهیم به صورت کاملا پایه ای به معرفی و استفاده از تکنیک های که jQuery در اختیار یک طراح وب قرار می دهد بپردازیم. معرفی jQuery معرفی jQuery به عنوان زبانی که نیاز به دانش سطح بالای برنامه نویسی ندارد ، توسط فعالان و توسعه دهندگان وب ، باعث شد که جاوا اسکریپت به طور کلی اعتبار از دست رفته خود را با ارائه تکنولوژی جدید و موارد کاربری تحت وب بار دیگر بدست آورد. این زبان با سرعت زیادی توسعه داده شد و توسعه دهنگان آن مبنای سرویس دهی آن را بر اساس تکنولوژی سمت سرویس گیرنده (کلاینت ساید) تنظیم کردند ، هدف آنان ایجاد زبانی بر مبنای جاوااسکریپ ولی همراه با قدرت و سرعت بیشتر و درعین حال دسترسی کامل و سریع به کتابخانه های مورد نیاز جاوا اسکریپت جهت حل مشکلات نمایش یک صفحه وب در مرورگر های مختلف بود. این زبان روش های جدید و نوینی را در اختیار طراحان وب قرار داد تا با کمک عواملی دیگر ، نسخه ای جدید از وب را معرفی کنند. با وجودیکه jQuery مدت زیادی نیست که به عنوان یک ابزار کارآمد به طراحان و برنامه نویسان وب معرفی شده است ولی همانند یک طوفان با سرعت زیادی جوامع آنلاین توسعه دهنده گان و طراحان وب را در نوردید و توانست توجه مدیران سایت هایی نظیر MSNBC جهت استفاده از این زبان در ساختار سایت خود را جلب کند و یا در پروژه های کد بازی نظیر SourceForge ، Trac و Drupal مورد استفاده قرار گیرد. در مقایسه با دیگر ابزار ها که توجه ویژه ای به ساختار هوشمند و کارا در استفاده از تکنیک های جاوا اسکریپت دارند ، jQuery توانایی تغییر مسیری را دارد که طراحان وب در مورد ایجاد یک صفحه وب در ذهن خود می پروانند. خیلی سریعتر از قبل و با کمتر درگیری با توابع و عملکرد های پیچیده جاوا اسکریپت که عموما و در زمان های قبل استفاده می شد ، طراحان وب قادر خواهند بود با استفاده از اطلاعاتی که به طور معمول در مورد طراحی وب دارند (CSS و XHTML) عناصر صفحات وب را ایجاد و مدیریت کنند. چرا jQuery؟ اگر شما مدت زمانی را صرف ایجاد بخشی پویا در صفحه خود کرده باشید ، حتما به این نکته توجه کرده اید که دائما باید از یک الگو برای یک عنصر در چند جای مختلف استفاده کنید تا بتوانید مجموع آنها را به یک روش و رویه مشخص نمایش دهید. شما می تونید بعضی از آنها را پنهان کنید و یا برخی دیگر را آشکار کنید ، می توانید یک کلاس مشخص CSS برای عنصر مورد نظر انتخاب و ایجاد نماید و یا از خواصیت های هر عنصر به صورت جدا جدا و تک به تک استفاده کنید و مقادیر متفاوتی را به آنها نسبت دهید ولی تنها با استفاده از یک خط از کد های jQuery می توان تمام آنچه را که مورد نیاز داشته اید را در زمانی خیلی کوتاه ایجاد کند. سازندگان jQuery برای این زبان کتابخانه ای در نظر گرفته اند که باعث می شود کار های پیچده که به صورت عمومی مورد استفاده طرحان وب قرار می گیرد در کوتاه ترین زمان ممکن و به ساده ترین صورت ممکن در اختیار ایشان قرار گیرد. برای مثال ، برخی از طراحان از جاوااسکریپت برای نمایش “راه راه” ردیف ها و یا ستون های یک جدول استفاده می کنند. تغییر رنگ هر ردیف یا ستون خود به تنهایی نیاز به نوشتن چندین خط دستور و کد است ولی تنها با استفاده از یک خط از دستور jQuery می توان به هدف مورد نظر رسید: کد: $("table tr:nth-child(even)").addClass("striped"); نگران نباشد ، شاید این خط کد در حال حاضر برای شما کاملا مرموز و درک آن کمی پیچیده باشد ولی در ادامه این مقالات درک کامل و بهتری از آن پیدا خواهید کرد و خواهید آموخت چگونه به صفحه خود جان ببشخید و آن را به صورت کاملا پویا نمایش دهید. ادامه دارد.... منبع: روزنامه جام جم
پاسخ : Jquery را بشناسید جاوااسکریپت نامحسوس در بخش قبل jQuery را معرفی کردیم و توضیحاتی در مورد اینکه چرا در کار های خود jQuery را انتخاب می کنیم نیز ارائه کردیم.اما بگذارید تا توضیحات بیشتری درباره خاصیت های جاوااسکیپت و jQuery بدهیم. شاید بعضی از شما روز های بد طراحان وب را که قبل از ارائه Css وجود داشت ، به خاطر بیاورید ، زمانی که طراحان مجبور بودند فرم دهی های لازم عناصر صفحه را در خود بدنه صفحه HTML مورد نظرایجاد کنند. هر کسی که یک صفحه وب را با صرف وقتی زیاد از طرق روشی که به آن اشاره شد طراحی کرده باشد با یک صفحه وب که با صرف وقتی کمتر و فرم دهی با استفاده از Css آن را طراحی باشد ، مقایسه کند می تواند به خوبی تفاوت طراحی در روش استفاده از Css را درک کند. اضافه شدن Css به ابزارهای توسعه دهنده وب طراحان را قادر ساخت تا فرم دهی های لازم در طراحی یک صفحه وب را از ساختار صفحه جدا کنند و استفاده از برخی از تگ های HTML نظیر <font> را کاملا محدود کند. البته فقط جدا سازی روش های فرم دهی به عناصر یک صفحه از ساختار آن باعث آسانتر ساختن مدیریت آن صفحه برای طراحان وب نشد ، بلکه این قدرت را به طراحان وب داد تا طراحی و فرم دهی یک صفحه را با تغییر دادن فایل Css مربوطه و یا افزودن فایلی دیگر به کلی تغییر دهند و صفحه مورد نظر خود را به شکلی دیگر در کوتاهترین زمان ممکن نمایش دهند. امروزه تعداد کمی از طراحان وب به صورت عمدی از روش های منسوخ و قدیمی استفاده از فرم دهی عناصر در بدنه صفحه HTML استفاده می کنند ولی هنوز هم استفاده از روش زیر کاملا رایج و عمومی است. کد: <BUTTON> TYPE="BUTTON" ONCLICK="DOCUMENT.GETELEMENTBYID('XYZ').STYLE.COLOR='RED';"> کلیک کنید </BUTTON> به سادگی می توان دید که نمی توان در فرم دهی به این دکمه به خصوص در عنوان آن از تگ <font> و یا موارد مشابه دیگر استفاده کرد ولی با پیروی از قوائد Css می توان این کار را انجام داد. اما باید به این نکته توجه کرد که در این روش ، فرم دهی های انجام شده با ساختار عنصر دکمه همراه نمی شوند بلکه با رفتار این عنصر با استفاده از دستورات جاوااسکریپت و خاصیت DOM(Document Object Model) در هنگام فشردن این دکمه اجرا می شود. با استفاده از این دستور و هنگام کلیک کردن بر روی این دکمه ، عنصری که با نام xyz در صفحه مشخص شده است ، به رنگ قرمز نمایش داده می شود. با توجه به دلایلی که در جدا سازی فرم دهی های لازم از بدنه اصلی صفحه HTML ، به آنها اشاره شد ، بسیار سودمند خواهد بود تا رفتار های یک عنصر را نیز از ساختار آن جدا کنیم. این تغییرات را در اصطلاح “جاوااسکریپت نامحسوس” می گویند و سازندگان jQuery توجه زیادی را به این بخش اختصاص داده اند تا کتابخانه ای از دستورات ایجاد کنند و به صاحبان و سازندگان صفحات وب کمک کند تا این جدا سازی را به سادگی در صفحات خود ایجاد و استفاده کنند. جاوااسکریپت نامحسوس توسط گروهی از دستورات که آن را jQuery هوشمند می نامیم باعث می شود که هر عبارت منطقی جاوااسکریپت و یا وضعیتی که در تگ <body> صفحه HTML جا سازی شده باشد را تحت تاثیر خود قرار دهد ، البته باید توجه کرد که استفاده از هر کدام از صفت های رویدادی یک عنصر مانند (onclick) در یک اسکریپت ، در صورت استفاده در داخل تگ <body> باعث بروز خطا در صفحه ساخته شده می شود. ممکن است این سوال در ذهن شما ایجاد شود که: “چگونه ممکن است که از رویداد یک عنصر دکمه بدون استفاده از مشخصه onclick استفاده کرد؟” با استفاده از توضیحاتی که به آن اشاره کردیم ، پاسخ بسیار ساده است ، با ایجاد تغییرات در عنصر دکمه می توان به هدف خود رسید: کد: <button type="button" id="testButton">کلیک کنید</button> البته باید اسکریپتی به بخش <head> صفحه خود نیز وارد کنید: [ کد: CODE]<SCRIPT TYPE="TEXT/JAVASCRIPT"> WINDOW.ONLOAD = FUNCTION() { DOCUMENT.GETELEMENTBYID('TESTBUTTON').ONCLICK = MAKEITRED; }; FUNCTION MAKEITRED() { DOCUMENT.GETELEMENTBYID('XYZ').STYLE.COLOR = 'RED'; } </SCRIPT> [/CODE] با اسفاده از این اسکریپت ما در زمان بارگذاری صفحه کنترل تابع ()makeItRed را در اختیار دکمه مورد نظر قرار می دهیم تا در رویداد کلیک دکمه عنصری که در صفحه با نام xyz مشخص شده است را به رنگ قرمز نمایش داده شود. دقت کنید که در این اسکریپت ما ابتدا از وجود عنصر دکمه ای که با نام testButton در صفحه مشخص کرده ایم در هنگام بارگذاری صفحه اطلاع پیدا می کنیم و سپس تابع ()makeItRed را به آن نسبت می دهیم. اگر این مثال کمی برای شما تازگی داشت ، نگران نباشید ، در بخش های بعدی و با ارائه مثال های دیگر می توانید اطلاعات خوبی در این زمینه کسب کنید ، در آینده شما فرا خواهید گرفت jQuery چگونه به شما کمک خواهد کرد که حتی اسکریپتی که در مثال بالا به آن اشاره شد را کوتاهتر و ساده تر کنید. ادامه دارد.... منبع:روزنامه جام جم
پاسخ : Jquery را بشناسید ساختار و پوشش jQuery در بخش پیشین توضیحاتی درباره خصوصیات جاوااسکریپت و دلایلی که باید رویداد های یک عنصر را از خود آن عنصر جدا کنیم را ارائه کردیم ، جاوااسکریپت نامحسوس را معرفی کردیم و مثالی برای درک بهتر این مسئله آوردیم ، اکنون به سراغ مهارت ها و توانایی های بنیادی jQuery می رویم. بنیاد jQuery jQuery از پایه بنای کار بر روی جدا سازی اطلاعات و وقایع عناصر یک صفحه از بدنه اصلی آن صفحه قرار داده است به نحوی که اگر بدنه اصلی صفحه HTML را در سطح پایین فرض کنیم ، عملایاتی که jQuery بر روی عناصر صفحه انجام می دهد در سطح بالای بدنه اصلی صفحه HTML قرار خواهد گرفت. اگر با Css آشنایی داشته باشید ، به خوبی از قدرت بالای انتخابگرها آگاهی خواهید داشت که چگونه در این روش می توان با تعریف یک کلاس ، کنترل گروهی از عناصر یک صفحه را با نسبت دادن خواصیت هایی به آنها بدست گرفت و مکان و نوع قرار گرفتن آنها در صفحه را مشخص کرد. jQuery به شما این قدرت را می دهد تا با استفاده از دانشی که در اختیار دارید و ابزاری که jQuery در اختیار شما قرار می دهد ، به صورت کاملا وسیعی استفاده و اجرای جاوااسکریپت در صفحه های خود را ساده و روان کنید. با این تفاصیر jQuery از اهمیت بالایی در تضمین اجرای کد و دستورات نوشته شده در حالتی کاملا پایدار در مرورگر های مختلف وب خواهد داشت و اکثر مشکلات دستورات جاوااسکریپت ، مانند عدم انجام دستورات نوشته شده قبل از اینکه یک صفحه به طور کامل بارگذاری شود به سادگی برای ما حل شده و قابل استفاده است. اما ما باید برای انجام کار های عمومی به کتابخانه ای از دستورات مورد نیاز نیز دسترسی داشته باشیم. سازندگان و توسعه دهندگان jQuery از روشی ساده اما بسیار قدرتمند جهت توسعه خاصیت های اجرایی در این راه استفاده کرده اند به طوری که برنامه نویسانی که به تازگی با jQuery آشنا می شوند از خاصیت تطبیق پذیری این برنامه استفاده و دستوراتی که در کارهایشان مورد نیاز است را ایجاد و یا توسعه می دهند. اما بگذارید در ابتدا بدانیم که چگونه ممکن است از دانشی که در زمینه Css داریم در jQuery استفاده کنیم به نحوی که بیشترین درصد بهره را از آن ببریم. پوشش jQuery زمانی که Css به عنوان یک ابزار طراحی در وب ارائه شد و به طراحان این امکان را می داد تا طراحی و فرم دهی صفحات وب را از بدنه جدا کنند ، نیاز به راهی بود تا به صورت مستقیم به گروهی از عناصر یک صفحه از طریق یک فایل Css خارجی ، دسترسی داشته باشیم. روشی که در اینجا توسعه و بسط داده شد ، استفاده از انتخابگر ها بود که استفاده از آنها باعث می شد که به طور مختصر کنترل عناصر موجود در صفحه HTML را بدست بگیریم. برای مثال ، انتخابگر p a در یک فایل Css به تمامی عناصر لینک (<a>) در صفحه اشاره می کند که در داخل تگ <p> قرار داشته باشند. jQuery نیز چنین قدرتی به ما می دهد که توسط انتخاب گرها به عناصر مختلف صفحه دسترسی داشته باشیم ، البته . jQuery نتنها چنین امکانی به ما می دهد ، بلکه ، کمک می کند تا دستوراتی که کاملا در مرورگر های مختلف اجرا نمی شود نیز به طور معمول اجرا و نمایش داده شود. انتخاب گری که ما در بخش های قبل مثال زدیم (nth-child) برای نمایش “راه راه” ردیف های یک جدول مثال خوبی از انتخابگر های معرفی شده در CSS3 می باشد. برای کنترل گروهی از عناصر در یک صفحه ما از دستور زیر استفاده می کنیم: کد: (selector) $ ویا این دستور: کد: (jQuery(selector البته شما بیشتر با نمونه اول در دستورات مواجه خواهید شد که به دلیل کوتاهی و سادگی استفاده از آن است. به عنوان نمونه برای بدست آوردن کنتل تمامی عناصر لینک (<a>) که در داخل تگ <p> در یک صفحه قرار دارند می توان از کد زیر استفاده کرد: ("p a")$ تابع ()$ در اصل یک شیئ از جاوا اسکریپت را که حاوی یک آرایه از عناصر DOM که با انتخابگر منطبق است را بر می گرداند. این شیئ دارای تعداد زیادی از روش های از پیش تعیین شده است که می توانند بر گروهی از عناصر انتخاب شده تاثیر بگذارد. در بخش بعد توضیحات بیشتری در مورد قدرتی که jQuery در پوشش دادن عناصر یک صفحه می تواند به طراحان وب دهد ، ارائه خواهیم کرد. ادامه دارد.... منبع : روزنامه جام جم
