به کارگاه ترجمه ی سینا2 خوش آمدید!

تبلیغات شما در اینجا بالا

مقدمه آموزش جی کوئری فصل 2

 در هسته ی اصلی جی کوئری، موتور سلکتور(یا گزینشگر) آن وجود دارد، که به ما امکان می دهد تا عناصر را در داخل هر سند(document) بر اساس نام(name) و خصوصیت(attributes) و حالت و ... انتخاب(select) کنیم. به دلیل محبوبیت CSS،لازم بود که سینتکس سلکتورهای آن را قبول کنیم تا انتخاب عناصر در جی کوئری ساده تر شود.

 علاوه بر پشتیبانی از اکثر سلکتورهای مشخص شده در CSS 1.3 ، جی کوئری تعداد زیادی سلکتور شخص دارد که می توانیم  از آنها برای انتخاب عناصر بر اساس وضعیت های خاص استفاده کنیم. علاوه بر این، ما می توانیم سلکتورهای شخصی خود را نیز ایجاد کنیم! در این فصل به بررسی برخی از مسائل متداول به هنگام سلکت(انتخاب) کردن عناصر با جی کوئری می پردازیم.

قبل از اینکه اینکه به اولین دستور العمل بپردازیم، اجازه دهید برخی اصول پایه را مطرح کنیم.ساده ترین راه برای هدف قرار دادن(انتخاب کردن) ی عنصر یا یک مجموعه از عناصر در داخل یک سند(document) این است که از یک سلکتور CSS در داخل تابع jQuery استفاده کنیم. مانند زیر:

jQuery('#content p a');
//  دارد را انتخاب کرده و سپس عناصر پاراگراف درون آن را content ابتدا عنصری که آی دی
// درون آنها را انتخاب می کند a انتخاب کرده و سپس عناصر

 اکنون که ما عناصری را که لازم داشتیم انتخاب کردیم، می توانیم از هر متد جی کوئری که بخواهیم بر روی این مجموعه استفاده کنیم. بعنوان مثال، اضافه کردن یک کلاس به نام selected به تمامی عناصر a به سادگی به صورت زیر انجام می شود:

jQuery('#content p a').addClass('selected');

 جی کوئری متدهای پیمایش DOM زیادی را به ما ارائه می دهد تا به فرایند انتخاب و گزینش عناصر، به ما کمک کنند. مثل متد  next() و prev() و parent() . این متدها و دیگر متدها، یک سلکتور را بعنوان یک پارامتر می پذیرند و سپس نتیجه را برمی گردانند(returne می کنند).بنابراین ما می توانیم نه تنها در متد jQuery، بلکه در هر جایی که بخواهیم، استفاده کنیم.

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

 سلکتورها را باید جوری بنویسیم که قابل درک باشد، در مثال زیر از یک نمونه سلکتور پیچیده استفاده شده است:

jQuery('body div#wrapper div#content');

 هرچه که سلکتورها را بیشتر به صورت اختصاصی بنویسیم، به این معنی نیست که سریع تر اجرا خواهد شد. سلکتور بالا می تواند به صورت زیر نیز نوشته شود:

jQuery('#content');

 این سلکتور، همان کار بالا را انجام می دهد؛ اما شاخه های اضافی را از سر راه برداشته است. همچنین توجه داشته باشید که گاهی اوقات ما می توانیم با مشخص کردن یک محتوا(context) برای سلکتورها، بهینه سازی بیشتری داشته باشیم. این موضوع در فصل بعدی توضیح داده خواهد شد(در بخش 2.11).

!Donate

نوشتن دیدگاه

لطفا نظرات خود را بیان کنید. به سوالات در سریع ترین زمان پاسخ داده خواهد شد.اما به نکات زیر توجه کنید:
1. سعی کنید نظرات شما مرتبط با مقاله ی مورد نظر باشد، در غیر این صورت پاسخ داده نخواهد شد.
2. سوالات خود را به صورت کوتاه بیان کنید و از پرسیدن چند سوال به طور همزمان خودداری کنید.
3. سوال خود را به طور واضح بیان کنید و از کلمات مبهم استفاده نکنید.


تصویر امنیتی
تصویر امنیتی جدید

ستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعال