کاملا رایگان میباشد و قابل دریافت از سایت خودش یعنی : http://jQuery.com
اما چون قسمت کد سایت گوگل (code.google.com) چشم دیدن ما ایرانی ها رو نداره،اگر از اونجا نتونستید فایل رو دانلود کنید، میتونین از لینک زیر، فایل اصلی و در واقع همون کتابخونه jQuery رو دانلود کنید:
jQuery Version 1.3.2 (بهتره راست کلیک کنید و "سیو تارگت از" رو انتخاب کنید )
بعد از دانلود، فایل رو باید unzip کنید تا برسید به یک فایل با پسوند js که در واقع همون فایل اصلی کتابخونه jQuery هست.
خوب حالا یک قدم پیشرفت کردیم. یه مقداری فهمیدیم jQuery چیه و فایل کتابخونه رو هم حالا روی کامپیوتر خودمون داریم. مرحله بعد استفاده از این فایل و چند تا مثال کوچک میباشد.
این فایل باید در هر صفحه ای که میخواهید از jQuery استفاده کنید، در فایل HTML خودتون، به اون یه ارتباط بدید و حتما بهتر از من میدونین که این کار رو باید به صورت زیر انجام داد:
<script type="text/javascript" src="jQuery1.3.2.js"></script>
و حتما باز هم میدونید که این کد رو باید در قسمت <head> قرار بدید و در بخش src باید آدرس فایل jQuery رو داد.
خوب بریم سر قسمت مثال ها. اول از همه باید ببینیم که چجوری میشه jQuery رو صدا زد تا بیاد و کار ما رو انجام بده.
بعد از تگ body باید یک تگ script باز کنید و به صورت زیر عمل کنید:
<script type="text/javascript">
$(document).ready(function() {
//کدهای شما در اینجا
});
</script>
این قطعه کد، همواره باید در استفاده از jQuery به همین صورت نوشته شود و کد های شما باید در قسمت مشخص شده نوشته شود. در واقع با این قطعه کد ما میخواهیم مطمئن شویم که ابتدا صفحه ما اماده دریافت کدهای کتابخونه هست یا نه. این آمادگی بر اساس لود شدن کامل اجزای صفحه سنجیده میشود.
در جاوا اسکریپت بدون استفاده از کتابخونه jQuery برای اینکه بفهمیم صفحه ما کاملا لود شده است از رویداد onLoad استفاده میکردیم. مشکل onLoad این هست که صبر میکنه تا کل صفحه بر روی مرورگر کلاینت لود بشه و بعد اجرا میشه، یعنی اگر توی صفحه متن و عکس زیادی داشتیم باید همه اونها کامل لود بشن تا onLoad فراخونی بشه. اما در jQuery و رویداد document.ready تنها کافیست اجزای سازنده صفحه لود بشوند و نه مطالب آن. پس استفاده از jQuery در بیشتر مواقع میتونه سریعتر از جاوا اسکریپت معمول باشه.
خوب، این تا اینجا. اما جریان اون علامت $ چیه ؟ علامت $ در کد jQuery به مفهوم استفاده از اجزا صفحه در دستورات هست. مثلا برای دسترسی به تگ لینک که <a> هست میگیم:
و در ادامه کد هم گفتیم که وقتی صفحه ما آماده شد. function رو اجرا کن. که کدهای مربوطه رو داخل اون مینویسیم.
در مثال زیر، بعد از document.ready میایم و تگ a رو فراخونی میکنیم و رویداد کلیک رو براش کد مینویسیم. خیلی راحته نه؟
نکته ای که بهش باید دقت کنید باز و بسته کردن پرانتز ها () و آکولاد {} هاست. قاطی نکنید با هم.
نکته دیگه ای که باید بهش توجه بشه اینه که در تگ لینک a ما هیچ کد جاوا اسکریپتی مثل onclick = function ننوشتیم و این در واقع قدرت jQuery هست که میتونه به صورت مستقیم با اجزا صفحه در ارتباط باشه.
مثال زیر رو ببینید:
البته سایت jquery.com در زمینه آموزش فوق العاده کامل و غنی هست.
<html>
<head><title>jQuery</title>
<script type="text/javascript" src="jQuery1.3.2.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$("a").click(function(){
alert("Helo World");
});
});
</script>
<a href="#">Click me!</a>
</body>
</html>
تکنیک ها و جریمه های Spam کردن موتور جست وجو