Kwa nini tunahitaji na jinsi ya kurekodi JQuery-selector?

Kisasa web designer lazima tu bwana misingi ya HTML, CSS na JavaScript, lakini pia kuwa na uwezo wa kufanya kazi katika maktaba JQuery, ambayo inalenga katika mahusiano ya JavaScript na-nyaraka HTML. Hiyo inaruhusu upatikanaji wa haraka kwa kipengele yoyote DOM (interface maombi ya programu ambayo hutoa upatikanaji wa maudhui files html-) na kuendesha yao. kuu vitengo miundo ya maktaba ni timu. Ili kuomba moja au timu nyingine, unahitaji JQuery-selector.

Mfumo selectors katika JQuery maktaba

selectors katika JQuery misingi ya matumizi katika CSS. Wao wanatakiwa kuchagua vitu HTML-faili, kuzitumia na kusababisha haya au njia nyingine ya kufanyia yao (timu). Search unafanywa kupitia selector $ () kazi. Kwa mfano, $ ( 'div').

selectors zinaweza kupangwa kulingana na jinsi uteuzi wa vipengele:

• msingi;
• na sifa;
• uongozi,
• maudhui;
• na hali;
• Uchaguzi wa mashamba fomu;
• wengine.

selectors muhimu

Katika 90% ya kesi wakati wa kutumia maktaba hii ni kutumika JQuery-selector walio kwenye kundi kuu. Wote ni rahisi sana na wazi. Hebu fikiria kila mmoja wao:

• * - huchagua mambo yote ukurasa, pamoja na kichwa, mwili, nk;.
• p / div / sidebar / ... - huchagua mambo yote yanayohusu tag predetermined (yaani kwa p.div, sidebar, nk ...);
• .myClass / p.myClass - huchagua mambo kwa maalum jina darasa;
• # MyID / p # myID -. Huchagua yoyote bidhaa moja kwa ID aliyopewa.

Hapa ni mfano. Tuseme sisi unahitaji kuchagua mambo yote kwenye ukurasa na kuingia par darasa itakuwa kama ifuatavyo: (. Par) $. Kama ni muhimu tu p mambo ya darasa hili, basi kuandika: $ (p.par).

sifa selectors

Unaweza kutumia JQuery kuu-selector, kama tunahitaji kuchagua bidhaa mali ya darasa yoyote ya kuwa na ID au kuchagua vipengele vyote katika ukurasa. Hata hivyo, kuna kesi wakati bidhaa haina darasa au ID. Ni kwa ajili hii na kuna uchaguzi na sifa. Wao kuruhusu kufanya uteuzi katika baadhi ya sifa ya HTML-vipengele, kama vile href au src. Sifa hii yaliyoandikwa katika mabano mraba [].

mfano rahisi: $ ([src]) - huchagua mambo yote ambayo src sifa. Inawezekana kupunguza sampuli kwa kubainisha baadhi ya sifa thamani: $ ([src = 'http: // tovuti / makala / 132222 / thamani']).

Unaweza kutumia baadhi selectors JQuery kama unataka kupunguza uwanja wa uchaguzi. Kwa mfano, $ (p [color = blue] [size = 12]) - huchaguliwa wale tu mambo p, ambayo rangi ya bluu na ukubwa 12.

selectors maudhui

Katika hali hiyo, kama huwezi kuchagua mambo kulingana na vipengele au selectors msingi, unapaswa kutaja maudhui yao. Kwa jumla kuna 4 selector ya aina hii:

• : Ina - kuchagua vitu vyenye maalum maandishi;
• : Je - huchagua mambo ambayo yana mambo mengine tabia ya line,
• : Mzazi - huchagua mambo ambayo yana nyingine yoyote;
• : Empty - huchagua mambo ambayo hayana nyingine yoyote.

Hapa ni mfano. Kuchagua mambo yote div, zenye maandishi ya Habari, unahitaji kuandika $ (div: inajumuisha ( 'Habari')).

selectors uongozi

Kuna njia nyingine ya kuchagua vipengele katika JQuery, yaani - kwa mujibu wa uongozi wao (yaani, uwiano wa kila mmoja juu ya HTML-ukurasa). mengi yao, hivyo sisi sasa wawili maarufu zaidi, "mtoto" na "mtoto".

Katika kesi ya kwanza mambo huchaguliwa, ambayo ni kizazi moja kwa moja (watoto) wa kipengele fulani (babu). Kwa mfano, kuchagua mambo ya orodha katika darasa mwanga ambayo ni orodha mtoto nav, basi unahitaji kuandika: $ (ul # nav> li.light).

kesi ya pili - zaidi ya jumla. Kuna inaweza kuchaguliwa na vizazi ya moja kwa moja ya kipengele. Kwa mfano, kuchagua viungo ndani ya orodha nav kuagiza: $ (ul # nav a).

Kwa hiyo, katika JQuery mambo inaweza kuchaguliwa kwa njia mbalimbali kwa kutumia vigezo kama vile darasa, ID, sifa, maudhui au uongozi wa mambo ya HTML-hati.