گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1396/06/02 - 11:29
كد :7814

چگونه در جی کوئری به زیر شاخه ها افکت بدهیم

در این مقاله نحوه افکت دادن به زیر شاخه های تگ انتخابی با جی کوئری را آموزش خواهیم داد

آموزش جی کوئری

در آموزش چگونه در جی کوئری به شاخه های بالاتر یک تگ افکت دهیم نحوه افکت گذاری بر روی شاخه های بالاتر از تگ انتخاب شده را در جی کوئری آموختیم. در این آموزش ما به شاخه های زیرین یک تگ انتخاب شده افکت خواهیم داد.

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

پایین رفتن از درختچه HTML در جی کوئری

جی کوئری دو متد برای پایین رفتن در زیر شاخه ها دارد این متدها عبارتند از:

children()
find()

متد children()

متد children() تمام زیر شاخه های اصلی تگ انتخاب شده را بر می گرداند.

این متد تنها یک سطح در زیرشاخه ها پایین میرود.

مثال زیر تمام تگ های را که زیر شاخه اصلی تگ DIV قرار دارند را برمیگرداند.

$(document).ready(function(){
$("div").children();
});

مشاهده نتیجه

 

شما میتوانید از پارامتر های اختیاری در متد children برای فیلتر کردن تگ انتخابی استفاده کنید.

مثال زیر تمام تگ های p را که کلاسی به نام first داشته باشند را در زیر شاخه تگ Div باز میگرداند:

 

$(document).ready(function(){
$("div").children("p.first");
});

مشاهده نتیجه

 

متد find()

متد find() زیر شاخه مشخص شده از تگ انتخاب شده را باز میگرداند.

مثال زیر تمام زیر شاخه تگ div که دارای تگ span باشند را باز میگرداند:

$(document).ready(function(){
$("div").find("span");
});

مشاهده نتیجه

 

مثال زیر تمام تگ های زیر شاخه تگ div را بازمی گرداند:

$(document).ready(function(){
$("div").find("*");
});

مشاهده نتیجه

 

براي بهره مندي از مشاوره تخصصي در زمینه طراحی سایت در کرج با شرکت سارگون تماس بگيريد

نظرات كاربران :