Kaj je potrebno in kako je napisan jQuery selektor?

Sodoben spletni oblikovalec ne bi smel biti lasten osnove HTML, CSS in jаvascript, lahko pa tudi delo v knjižnici jQuery, ki se osredotoča na interakcijo jаvascripta z dokumenti HTML. Omogoča vam hiter dostop in manipulacijo z vsemi elementi DOM (programski vmesnik, ki odpira dostop do vsebine html datotek). Glavne strukturne enote te knjižnice so ekipe. Če želite uporabiti ta ali ta ukaz, potrebujete izbirnik jQuery.

Formula selektorjev v knjižnici jQuery

JQuery selektorji temeljijo na tistih, ki se uporabljajo v CSS. Potrebne so za izbiro elementov HTML-datoteke, tako da jih uporabite za klic enega ali drugega načina manipuliranja z njimi (ekipa). Iskanje s selektorjem poteka s funkcijo $ (). Na primer, $ (`div`).

Izbirnike je mogoče razvrstiti glede na način izbora elementov:

• osnovno;
• po atributu;
• po hierarhiji;
• po vsebini;
• po položaju;
• izbor obrazcev;
• drugi.

Osnovni selektorji

V 90% primerov pri delu s to knjižnico se uporablja jQuery-selektor, ki spada v glavno skupino. Vsi so precej preprosti in razumljivi. Vsaka od njih razmislimo:

• * - izbere vse elemente strani, vključno z glavo, telesom itd .;
• p / div / sidebar / ... - izbere vse elemente, povezane z dano oznako (to je, p.div, stranske vrstice itd.);
• .myClass / p.myClass - izbere elemente z navedenim imenom razreda;
• # myID / p. # myID - izbere en element z navedenim ID-jem.

Naj navedem primer. Recimo, da moramo izbrati vse elemente strani z razredom par, vnos bo videti takole: $ (.par). Če so potrebni samo elementi p tega razreda, potem bomo napisali: $ (p.par).

Izbirniki atributov

Glavni selektor JQuery je mogoče uporabiti, če želimo izbrati element, ki spada v razred, ki ima ID ali izbere vse elemente strani. Vendar pa obstajajo časi, ko želeni element nima razreda ali ID-ja. Zato so selektorji po atributu. Ti vam omogočajo, da vzorec na nekaterih atribut elementa HTML, na primer, s href ali src. Ta atribut je napisan v kvadratni oklepaj [].

Najenostavnejši primer: $ ([src]) - izbere vse elemente, ki imajo atribut src. Območje vzorca lahko zožite tako, da določite atribut na določeno vrednost: $ ([src = `vrednost`]).

V programu JQuery lahko uporabite več selektorjev, če želite zožiti izbor. Na primer, $ (p [barva = modra] [velikost = 12]) - izbrani bodo samo tisti elementi p, ki so modri in velikost 12.

Izbirniki vsebine

V primeru, da ni mogoče izbrati postavk po atributih ali glavnih selektorjih, se je treba sklicevati na njihovo vsebino. Obstajajo 4 izbirniki te vrste:

• : vsebuje - izbere elemente, ki vsebujejo navedeno besedilo;
• : has - izbere elemente, ki vsebujejo druge elemente, značilne za to vrstico;
• : starševski - izbere elemente, ki vsebujejo vse druge;
• : prazen - izbere elemente, ki ne vsebujejo nobenih drugih.

Naj navedem primer. Če želite izbrati vse elemente div, ki vsebujejo besedilo Hello, morate napisati $ (div: contains (`Hello`)).

Hierarhični selektorji

Obstaja še en način izbire elementov v JQuery, in sicer glede na njihovo hierarhijo (to je odnos med seboj na strani HTML). Veliko jih je, zato sta tukaj dve najbolj priljubljeni: "otrok" in "otrok".

V prvem primeru so izbrani elementi, ki so neposredni potomci (otrok) danega elementa (prednika). Na primer, če želite izbrati elemente seznama razreda svetlobe, ki so otrok navzgor, morate napisati: $ (ul # nav> li.light).

Drugi primer je bolj splošen. Tukaj lahko izberete tudi posredne potomce elementa. Na primer, da bi izbrali povezave znotraj navzgor, bomo napisali: $ (ul # nav a).

Tako je v JQuery elemente mogoče izbrati na različne načine z uporabo parametrov, kot so razred, ID, atributi, vsebina ali hierarhija elementov dokumenta HTML.