آموزش نحوی jQuery

با جی‌کوئری، می‌توانید عناصر HTML را انتخاب (جستجو، query) کنید و روی آنها عملیاتی انجام دهید.

مثال زبان جی‌کوئری

$(this).hide()
مثال نمایش جی‌کوئری hide()، پنهان کردن عنصر HTML فعلی
$("#test").hide()
مثال نمایش جی‌کوئری hide()، پنهان کردن عنصر با id="test"
$("p").hide()
مثال نمایش جی‌کوئری hide()، پنهان کردن تمام عناصر <p>
$(".test").hide()
مثال نمایش جی‌کوئری hide()، پنهان کردن تمام عناصر با class="test"

آموزش نحوی jQuery

زبان جی‌کوئری برای انتخاب کردن عناصر HTML طراحی شده است و می‌توانید روی عناصر عملیاتی انجام دهید.

زبان پایه:$(selector).action()

  • علامت دلار معنای جی‌کوئری را مشخص می‌کند
  • مشخص‌کننده (selector) "جستجو" و "یافتن" عناصر HTML
  • عملیات action() جی‌کوئری عملیاتی را روی عناصر انجام می‌دهد

مثال:

$(this).hide() - پنهان کردن عنصر فعلی

$("p").hide() - پنهان کردن تمام پاراگراف‌ها

$(".test").hide() - پنهان کردن تمام عناصر با class="test"

$("#test").hide() - پنهان کردن تمام عناصر با id="test"

توضیح:جی‌کوئری از ترکیب نحوه‌های XPath و انتخابگرهای CSS استفاده می‌کند. در فصل‌های بعدی این آموزش، شما بیشتر درباره نحوه‌های انتخابگر یاد خواهید گرفت.

توابع ready document

شاید شما توجه کرده‌اید که تمام توابع jQuery در مثال ما در یک تابع ready document قرار دارند:

$(document).ready(function(){
  // توابع jQuery در اینجا قرار می‌گیرند
});

این برای جلوگیری از اجرای کد jQuery قبل از بارگذاری کامل مستند (آماده) است.

اگر قبل از بارگذاری کامل مستند، تابع اجرا شود، عملیات ممکن است شکست بخورد. دو مثال مشخص زیر را ببینید:

  • تلاش برای پنهان کردن یک عنصر موجود نیست
  • سعی کنید اندازه تصویر ناخوانده شده را دریافت کنید