با عرض سلام و وقت بخیر خدمت کاربران سایت پی وی لرن . و کاربرانی که دوره کامل آموزش jQuery ، را دنبال می کنند. تاکنون چگونگی پیمایش در درخت DOM، و پیدا کردن عناصر والد و فرزندان آن ها را به همراه توابع ارائه شده در این زمینه را، بررسی کردیم.در ادامه ی فصل، در این بخش به موضوع جستجوی سفارشی در تکنیک Traversing در jQuery یا Filtering در تکنیک Traversing در jQuery ، می پردازیم.
در بخش قبلی این فصل به چگونگی پیمایش درخت DOM ، برای برگرداندن عناصر خواهر و برادر عنصر انتخاب شده ، اشاره کردیم. و با توابع و روشهای آن نیز آشنا شدیم.
در حال حاضر ، به موضوع جستجوی سفارشی یا Filtering در تکنیک Traversing در jQuery ، می پردازیم.
jQuery ، توابعی را برای پیدا کردن عنصر مشخصی در بخش های مختلف درخت DOM ، معرفی می کند:
برخی از توابع فوق از جمله ()first و ()last از توابع پایه بوده و برای پیدا کردن یک عنصر مشخص، بر اساس موقعیت فعلی در درخت DOM، بکار می رود.
برخی از توابع از جمله ()filter و ()not ، برای اعمال فیلتر های بیشتر و جستجوی دقیق تر یک عنصر ، استفاده می شود.
این تابع اولین عنصر از عناصر مشخص شده را برمی گرداند.
مثال: در این مثال اولین عنصر <div>
، انتخاب شده و مشخص می شود.
1 2 3 | $(document).ready(function(){ $("div").first(); }); |
تابع ()last ، آخرین عنصر از عناصر مشخص شده را، بر می گرداند.
در این مثال آخرین عنصر <div>
، انتخاب می شود:
1 2 3 | $(document).ready(function(){ $("div").last(); }); |
تابع ()eq ، پارامتری برای مشخص کردن عدد index، یا شماره ی عناصر را دارد. و به این صورت عنصر مشخص شده ای که شماره index که مشخص کرده ایم را داشته باشد. بر می گرداند.
نکته: شماره گذاری index عناصر، از “۰”شروع می شود. یعنی شماره اولین عنصر “۰” است.
مثال: در این مثال ، دومین عنصر <p>
، انتخاب می شود:
1 2 3 | $(document).ready(function(){ $("p").eq(1); }); |
تابع ()filter، به شما اجازه می دهد. یک معیار را مشخص کنید.تنها عناصری که شامل این معیار باشند. انتخاب می شوند. و سایر عناصر در نظر گرفته نمی شود.
مثال: در این مثال تمام عناصر <p>
که نام کلاس آنها “intro” است، انتخاب می شود:
1 2 3 | $(document).ready(function(){ $("p").filter(".intro"); }); |
ساختار این تابع دقیقا شبیه تابع ()filter، است. اما درست بر عکس تابع ()filter، عمل کرده و تمام عناصری که شامل معیاری که مشخص کرده ایم نباشند. را انتخاب می کند.
مثال: ین مثال تمام عناصر <p>
که نام کلاس آنها “intro” نباشد، انتخاب می شود:
1 2 3 | $(document).ready(function(){ $("p").not(".intro"); }); |
این بخش که آخرین بخش از فصل تکنیک Traversing، بود. روشهای پیمایش و برگرداندن عناصر مختلف را در درخت DOM ، با ارائه موضوع جستجوی سفارشی یا Filtering در تکنیک Traversing در jQuery ، تکمیل شد. امیدوراریم که مطالب این بخش نیز به اندازه ی کافی برای شما آموزنده بوده باشد.