Info@Afragraphic.ir
0912 22 460 22
خدمات و مطالب آموزشی

آموزش jQuery -- انتخابگرهای جی کوئری

انتخابگرهای  جی کوئری                                                                                  قسمت چهارم

  • انتخابگرهای جی کوئری یکی از مهم ترین بخش های کتابخانه جی کوئری می باشد.
  • انتخابگرهای جی کوئری به شما اجازه انتخاب و دستکاری عناصر HTML  را می دهد
  • انتخابگرهای جی کوئری می توانند المان های html را بر اساس (id, classes, types, attributes, values) و همچنین برخی css های اعمال شده بر روی آن ها  پیدا کنند
  • همه انتخابگر ها با علامت $ شروع می شوند
 
انواع انتخابگرهای جی کوئری :
 
انتخاب بر اساس المان :
این انتخاگر بر اساس نوع المان می باشد 
با این انتخابگر شما می توانید تمامی تگ های <p> یک صفحه را انتخاب کنید
$("p")
مثال :
 وقتی کاربر بر روی Button  کلیک کرد تمام تگ های p مخفی می شوند
 

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

انتخابگر بر اساس  id# :

جی کوئری با استفاده از خصوصیت id المان های آن ها را پیدا می کند

یک id برای هر المان منحصر به فرد می باشد و زمانی از آن استفاده می کنیم که دنبال یک تک عنصر خاص باشیم

$("#test")

مثال :

زمانی که کاربر بر روی Button کلیک می کند المانی که id آن "test" می باشد مخفی می شود

$(document).ready(function(){
    $("button").click(function(){
        $("#test").hide();
    });
});

انتخابگر بر اساس class. :

جی کوئری با استفاده از خصوصیت Class المان ها آن ها را پیدا می کند

$(".test")

مثال :

زمانی که کاربر بر روی Button کلیک می کند المان هایی که کلاس  " test" را دارند مخفی می شوند

$(document).ready(function(){
    $("button").click(function(){
        $(".test").hide();
    });
});

مثال های بیشتری از انتخاب گر های جی کوئری :

انتخاب همه عناصر

$("*")

انتخاب عنصر فعلی

$(this)

انتخاب همه عناصر < P> با کلاس = " intro"

$("p.intro")

انتخاب اولین عنصر <p> 

$("p:first")

انتخاب اولین <li> از اولین عنصر <UL>

$("ul li:first")

انتخاب اولین <li> از همه عناصر <UL>

$("ul li:first-child")

تمام عناصر با خصوصیت href

$("[href]")

تمام عناصر <a> با خصوصیت Target  برابر blank

$("a[target='_blank']")

تمام عناصر <a> با خصوصیت Target  نا برابر blank

$("a[target!='_blank']")

تمام عناصر <button>  و <input> با type برابر button

$(":button")

انتخاب تمام عناصر <tr> زوج

$("tr:even")

انتخاب تمام عناصر <tr> فرد

$("tr:odd")

 

پایان قسمت چهارم
منبع : https://www.w3schools.com

 

نظــرات شما

نام :
وب سایت :
ایمیل :
پیغام :  

تمامی حقوق مادی و معنوی این سایت متعلق به شرکت طراحی و چاپ افراگرافیک  می باشد.