3) سینتکس جی کوئری (Syntax)

تونل یادگیری جی کوئری

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

سینتکس جی کوئری

برای کد نویسی با جی کوئری باید با دستوراتی آشنا شویم که میخواهیم بر روی المان خاصی از صفحه اعمال شود. به بیانی دیگر باید سلکتور (Selector) در کنار یک دستور یا تابع قرار بگیرد. به مثال زیر دقت کنید.

$("#test").hide()

این دستور به محض اجرا المانی که آیدی test را دارد،  پنهان میکند. در قسمت های بعدی تونل به طور کامل با این دستورات آشنا میشویم. اما نکته ای که در دستور بالا حتما توجه شما را به خود جَلب کرده است این است که این دستور چه زمانی اجرا میشود؟!
برای اجرای کد های جی کوئری باید کدهایمان را به صورت زیر بنویسیم:

$(document).ready(function(){
// jQuery methods go here...
});

در قسمتی که کامنت قرار داده شده است سلکتورها، event ها و دستورات جی کوئری مان را مینویسیم. دستوراتی که در این تابع قرار میگیرند به محض آماده شدن سند html اجرا می شوند. اجرای این دستورات قبل لود تصاویر و فایل های دیگر صورت میگیرد. اگر در کد جی کوئری  بالا به جای ready از دستور load استفاده کنیم دستورات ما بعد از بارگذاری کامل صفحه اجرا می شوند. اگر به جای سلکتور document یک آیدی یا کلاس قرار دهیم، دستورات Jquery ما پس از بارگذاری آن سلکتور اجرا میشوند.

به نمونه زیر دقت کنید:

$(document).ready(function(){
$("p").hide();
});

در کد بالا بعد از آماده شدن صفحه، تگ های p پنهان میشوند.