jQuery انتخابگرها (jQuery Selectors)
اینجا با «انتخابگر jQuery» آشنا می شوی. «انتخابگر (Selector)» یعنی راهی برای پیدا کردن عناصر صفحه. با jQuery کار کوتاه تر می شود؛ با جاوااسکریپت استاندارد هم شدنی است.
jQuery یا JavaScript استاندارد؟
jQuery برای یکسان سازی مرورگرها ساخته شد. اما بعد از ES5، خیلی از کارها را با چند خط جاوااسکریپت می توان انجام داد. هنوز هم سینتکس jQuery کوتاه است و خوانا.
نکته: برای شروع، همین صفحه و لینک انتخابگر jQuery کافی است.
یافتن عنصر با Id
وقتی شناسه داری، مستقیم همان عنصر را بگیر.
const myElement = $("#id01");
const myElement = document.getElementById("id01");
یافتن عناصر با نام تگ
وقتی نوع تگ مهم است، همه آن ها را بگیر.
const myElements = $("p");
const myElements = document.getElementsByTagName("p");
یافتن عناصر با نام کلاس
وقتی استایل یا گروه مشترک داری، با کلاس انتخاب کن.
const myElements = $(".intro");
const myElements = document.getElementsByClassName("intro");
یافتن با انتخابگرهای CSS
می خواهی دقیق تر باشی؟ از ترکیب های CSS استفاده کن.
const myElements = $("p.intro");
const myElements = document.querySelectorAll("p.intro");
گام های عملی
- نوع انتخابگر را مشخص کن.
- عبارت انتخابگر را بنویس.
- نتیجه را در متغیر ذخیره کن.
- روی نتیجه، کارهای بعدی را انجام بده.
جمع بندی سریع
- #id برای عنصر یکتا سریع است.
- .class گروه ها را برمی گرداند.
- tag همه تگ های مشابه را می آورد.
- CSS selector دقیق ترین کنترل را می دهد.
منابع داخلی: JSONP، JSON و HTML، و انتخابگر jQuery.