جی‌کوئری

جی‌کوئری شامل ویژگی‌های زیر است:

• دسترسی به عناصر موجود در پرونده و تغییر در آنها.
• کنترل آسان و قدرتمند تر رویدادها (Events).
• تغییر در آرایش و چینش صفحه (دقیقا کاری که با CSS انجام میشود).
• ایجاد افکت و حرکات انیمیشن.
• توسعهٔ افزونه‌هایی بر پایه جی‌کوئری.

کتابخانهٔ جی‌کوئری معمولاً (بدون افزونه) تنها یک فایل جاوااسکریپت است. فایل جی‌کوئری را می‌توان به شیوه‌های مختلفی به صفحه وب متصل کرد.

<script type="text/javascript" src="jquery.js"></script>

استفاده از رابط برنامه‌نویسی گوگل برای اضافه کردن جی‌کوئری

<script type="text/javascript" src="//google.com/jsapi"></script>

<script>
google.load("jquery", "1.4.2");
</script

استفاده از شبکه توزیع محتوای گوگل برای اضافه کردن جی‌کوئری

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

استفاده از شبکه توزیع محتوای مایکروسافت برای اضافه کردن جی‌کوئری

<script src="//ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js" type="text/javascript"></script>

استفاده از محتوای جِی‌کوئری

دسترسی و انجام تغییرات بر روی یک گروه از عناصر صفحه (DOM) با تابع $ شروع می‌شود و به همراه آن یک رشته انتخاب گر (Selector) سی‌اس‌اس می‌آید که در نتیجه، جی‌کوئری می‌تواند به عناصر صفحهٔ وب دسترسی پیدا کند و ان‌ها را تغییر دهد.

$("p.myclass").hide();

در این نمونه کد ساده، با استفاده از تابع $ ، عناصری که خواهان اعمال تغییر روی آن ها هستیم را انتخاب کردیم. در این مورد، انتخاب ما تمامی تگ های p (پاراگراف) هستند که دارای کلاس "myclass" باشند. سپس با استفاده از تابع hide ، عناصر انتخاب شده را پنهان میکنیم.

تابع each.$ ، روشِ مفید و آسانی است که برای عناصر داخل یک آرایه، یک عمل مشابه را انجام دهیم.

$.each([1,2,3], function()
{
  document.write(this + 1);
});

این تابع ارقام ۲۳۴ را در پرونده می‌نویسد.

این امکان وجود دارد که درخواست‌های مبتنی بر اِی‌جکس از طریق ajax.$ و متدهای وابسته تبادل شود:

$.ajax({
  type: "POST",
  url: "some.php",
  data: "name=John&location=Boston",
  success: function(msg){
    alert("Data Saved: " + msg);
  }
});

در بالا برنامه، داده‌های name=john و location=boston را به صفحه some.php ارسال می‌کند و وقتی این درخواست با موفقیت به پایان رسید تابعی فراخوانده می‌شود تا این اتفاقات را به کاربر اعلام کند.

• جاوااسکریپت محجوب