تبلیغات
یادداشت های من - آموزش JQuery – جلسه سوم: انتخاب کننده ها Selectors

یادداشت های روزانه من درباره اینترنت، سیاست، آبکنار، رایانه، شعر، فناوری اطلاعات و ...
هر چیزی که بهش علاقه دارم

حسین (کیوان) جهانبخش آبکنار

جستجو

 

آموزش JQuery – جلسه سوم: انتخاب کننده ها Selectors

سه شنبه 3 خرداد 1390   12:24 ب.ظ

انتخاب کننده های جی کوئری به شما اجازه می دهد که عناصر و تگ های HTML را به عنوان یک عنصر گروهی یا تکی انتخاب کرده و به آنها دسترسی داشته باشیم.


انتخاب کننده های JQuery

در جلسه قبل ما به بعضی از مثال هایی که در رابطه با انتخاب عناصر مختلف HTML پرداختیم. این مثال ها یک آشنایی با این موضوع بود که شما چگونه می توانید آن چیزی را که می خواهید روی آن عملی انجام دهید را دقیقاً انتخاب نمایید.

انتخاب کننده های جی کوئری به شما اجازه می دهند که یک عنصر HTML (یا مجموعه ای از عناصر) را با استفاده از نام آن عنصر، نام خاصیت آن یا محتویات آن عنصر انتخاب نمایید.

درباره HTML DOM
سلکتورها (انتخاب کننده ها) به شما اجازه می دهند که به گروهی یا یکی از عناصر HTML DOM دسترسی داشته باشید.

انتخاب کننده های عنصر JQuery

جی کوئری از همان انتخاب کننده های CSS برای انتخاب عناصر HTML استفاده می کند.

$(“p”): تمام عناصر <p> را انتخاب می کند.

$(“p.intro”): تمام عناصر <p> با خصوصیت class=”intro”

$(“p#demo”): اولین عنصر <p> با خصوصیت id=”demo”

انتخاب کننده های خصوصیت JQuery

جی کوئری از ساختار زبانی XPath برای انتخاب عناصر با استفاده از خصوصیاتشان استفاده می کند.

$(“[href]”): تمام عناصری که دارای خاصیت href باشند انتخاب می کند.

$(“[href=’#’]”): تمام عناصری که مقدار خصوصیت href آن برابر # باشد انتخاب می کند.

$(“[href!=’#’]”): تمام عناصری که مقدار خصوصیت href آن برابر # نباشد انتخاب می کند.

$(“[href$=’.jpg’]”): تمام عناصری که مقدار خصوصیت href آن ها به .jpg ختم می شود انتخاب می کند.

انتخاب کننده های CSS در جی کوئری

انتخاب کننده های CSS در جی کوئری امکان دسترسی به خصوصیات CSS یک عنصر HTML را به شما می دهد.

مثال زیر رنگ پس زمینه تمام عناصر <p> صفحه را به رنگ زرد تبدیل می کند.

$("p").css("background-color","yellow");

چند مقال دیگر:

$(this)

عنصر جاری HTML

$("p")

تمام عناصر <p>

$("p.intro")

تمام عناصر <p> با خاصیت class=”intro”

$(".intro")

تمام عناصر صفحه با خصوصیت class=”intro”

$("#intro")

اولین عنصر با خاصیت id=”intro”

$("ul li:first")

اولین هنصر <li> از هر <ul>

$("[href$='.jpg']")

همه عناصر با خصوصیت href که به .jpg ختم شود.

$("div#intro .head")

تمام عناصر با class=”head” که در داخل یک عنصر <div> با خاصیت id=”intro” قرار دارند.

 

بعد از اتمام جلسات رفرنسی برای تمام انتخاب کننده ها قرار خواهم داد. البته شما تا پایان جلسات با تقریباً تمام آنها آشنا خواهید شد.

 


پ ن : این مجموعه آموزش ها از سایت W3C ترجمه شده و خواهد شد. جهت آشنایی خودم و دیگران منتشر می کنم.


نوشته شده توسط : حسین (کیوان) جهانبخش آبکنار

نوع مطلب : JQuery ،طراحی وب ،