تبلیغات
6 تایی - مقدمه معرفی jQuery

امروز:

مقدمه معرفی jQuery

مقدمه معرفی jQuery

آموزش jquery

آموزش jquery

jQuery چیست ؟

jQuery یک کتابخانه استاندارد آماده حاوی تعدادی متد و توابع نوشته شده به زبان JavaScript است . از توابع متدهای این کتابخانه برای کار با عناصر و تگ های موجود در صفحات HTML , ASP.Net یا PHP استفاده می شود . به طور کلی با مصرف از این متدهای از پیش تعریف شده می توانید تغییراتی را در عناصر تگ های HTML ایجاد کرده یا روش نمایش آنها را تغییر دهید . جهت مثال می توانید عنصر HTML را با کلیک بر روی یک دکمه فرمان پنهان کرده یا در صورت مخفی بودن آن را نمایش دهید .
زبان jQuery دارای شعار زیاد دیده شده است . این شعار می گوید کمتر بنویسید بیشتر انجام دهید ( write less , do more ) . به طور کلی کتابخانه jQuery حاوی موارد زیر است :
در مصرف از jQuery شما نیاز ندارید برای انجام کارهای مورد نظرتان تابع نو بنویسید . تنها کافی است عنصر مورد نظر خود را انتخاب کرده پس متد مورد نظر را فراخوانی کرده تا آن عنصر را تغییر دهد .
قبل از مطالعه و استفاده از بخش jQuery ، شما می بایست با مطالب زیر آشنایی کامل داشته باشید :

HTML
CSS
JavaScript
نحوه مصرف از کتابخانه jQuery :

همان گونه که گفتیم jQuery یک کتابخانه استاندارد آماده است . شما می بایست برای مصرف از jQuery فایل این کتابخانه را به صفحه متصل بکنید . کتابخانه jQuery در فایل مجزا که از نوع فایل های JavaScript و با نام jQuery.js است مراقبت می شود . شما برای اتصال فایل این کتابخانه به صفحه مورد نظرتان از 2روش می توانید مصرف بکنید :

دانـلود فایـل کتابخانه jQuery بر روی رایانه یا سرور وب سایت خودتان پس اتصال آن به صفحه .
مصرف از فایـل کتابخانه jQuery بر روی سرورهای آنلاین مثل سرور Microsoft یا Google .
در ادامه به معرفی 2آموزش فوق می پردازیم .
روش اول : درآموزش اول شما می بایست جدید ترین فایل کتابخانه jQuery را از سایت www.jQuery.com دانـلود کرده پس آن را در پوشه اصلی سایت قرار دهید . پس با استفاده از یک تگ < Script > که در پارت < Head > صفحه قرار می دهید ، فایل کتابخانه را به صفحه متصل بکنید . در قسمت زیر اینروش را نشان داده ایم :

Syntax < head >
< script type = " text/javascript " src="jquery.js" > < /script >
< /head >
روش دوم : درروش دوم شما لینک دسترستی به فایل کتابخانه jQuery ، که بروی سرور مورد نظرتان است را در یک تگ < Script > و در پارت < Head > صفحه قرار می دهید . در این حالت صفحه در زمان لود شدن به سرور وصل شده از کتابخانه آنلاین مصرف می نماید . در پارت زیر هر 2 لینک و طریقه استفاده از آنها را نمایش داده ایم :

Syntax ( سرور مایکروسافت ) < head >
< script type = " text/javascript " src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js " > < /script >
< /head >


Syntax ( سرور گوگل ) < head >
< script type = " text/javascript " src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js " > < /script >
< /head >
بعد از اتصال کتابخانه jQuery به صفحه خودتان ، هر زمان که متد jQuery را فراخوانی می بکنید ، پروگرام سورس آن متد را از کتابخانه دریافت کرده پس اجرا می نماید . در مثال بخش بعد بهروش کلی کار با توابع jQuery یک نمونه از کاربر د آن اشاره می نماییم .

یک مثال از فرد د jQuery :

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

در مثال زیر صفحه فرضی با 2 پاراگراف یک تیتر داریم . می خواهیم تا کاربر بتواند با کلیک بر روی دکمه فرمان پارگراف های موجود در صفحه را پنهان نماید .راهنمای کار به این شرح است :
در ابتدا به وسیله یکی از لینک های معرفی شده ، صفحه خود را به کتابخانه jQuery متصل کرده ایم . سپس یک دکمه فرمان یک تیتر و 2 پاراگراف را بروی صفحه ایجاد کرده ایم . با کلیک کاربر بر روی دکمه فرمان متد ( ) Hide که یکی از متدهای jQuery است ، اجرا شده باعث می شود تا تمام پاراگراف های ( تگ های < p > ) موجود بر روی صفحه پنهان شوند . همان گونه که در خروجی مشاهده می بکنید تابع ایجاد شده فقط بر روی عناصری که تگ آنها از نوع < p > ( پاراگراف ) است تاثیر می گذارد برای مثال با تگ تیتر < h2 > کاری ندارد .
جهت مشاهده عملکرد مثال بر روی دکمه فرمان خروجی کلیک نمایید .





This is a heading




This is a paragraph .




This is another paragraph.


Click me



Example
< html >
< head >
< script type="text/javascript" src="jquery.js" > < /script >
< script type="text/javascript" >
$ (document). ready ( function( )
$ ("button") . click ( function( )
$ ( " p " ) . hide( );
);
);

کد
This is a heading

This is a paragraph .

This is another paragraph.


نوشته شده در : یکشنبه 3 مرداد 1395  توسط : مطالب علمی 2015.    نظرات() .

http://katherincruikshank.blogas.lt/
پنجشنبه 21 اردیبهشت 1396 05:58 ب.ظ
Hello there, just became aware of your blog through Google, and
found that it's truly informative. I'm gonna watch out
for brussels. I'll be grateful if you continue
this in future. Many people will be benefited from your writing.
Cheers!
BHW
یکشنبه 20 فروردین 1396 11:56 ق.ظ
you are really a excellent webmaster. The site loading velocity
is incredible. It sort of feels that you're doing any unique trick.

Moreover, The contents are masterpiece. you've done a great task on this matter!
 
لبخندناراحتچشمک
نیشخندبغلسوال
قلبخجالتزبان
ماچتعجبعصبانی
عینکشیطانگریه
خندهقهقههخداحافظ
سبزقهرهورا
دستگلتفکر