jQuery var atlasīt visu, ko CSS3 var atlasīt. Bet ar to viss neapstājas! JQuery piedāvā vairākus papildu selektorus (izmantojot Sizzle selektora motoru), kas dažreiz ir diezgan noderīgi. Piemēram, CSS ir atribūtu atlasītāji, kas ļauj atlasīt elementu, pamatojoties uz jebkuru elementa patvaļīgu atribūtu. Piemēram:
Ir CSS selektors, kuru mēs varam izmantot jQuery, lai atlasītu:
$("(data-whatever='elephant-eyeballs')");
Atribūtu atlasītājā ir variācijas, piemēram, tā vietā, lai =
jūs varētu darīt, ^=
lai norādītu “sākas ar šo vērtību”. Bet nez kāpēc CSS nav! = Vai “nav vienāds ar šo vērtību”. jQuery dara! Tas ir jQuery selektora paplašinājuma piemērs.
Šo selektora paplašinājumu ir daudz. Daži, par kuriem mēs īpaši runājam šajā ekrāna sūtījumā:
- : eq () - 0 indeksēta versija: n-child ()
- : pat - saīsne: n-bērnam (pāra)
- : gt (n) - atlasiet elementus ar lielāku indeksu nekā n. Arī saīsne sarežģītākam: n-child () forumla.
Iespējams, ka visnoderīgākais atlasītāja paplašinājums ir: has () - kas ierobežo atlasi ar elementiem, kas satur to, ko jūs nododat šim pseido selektoram (vai tas ir pseido pseido selektors :) Iespējams, ka kādreiz nākotnē CSS būs kaut kas līdzīgs tas mums (es domāju, ka tas būs kā pre ! code
), bet tas ir tālu. Diemžēl es šajā ekrāna sūtījumā neizteicu par to ļoti pārliecinošu argumentu, bet jūs zināt, kad jums tas būs nepieciešams! Piemēram, “Atlasiet visus .moduļus, kas satur joslu h3.sports” - šāda veida lieta.
Ja vēlaties, varat arī izveidot savus izvēles paplašinājumus. Šeit ir raksts par to. Piemērs ir padarīt :inview
elementu atlasošu tikai tad, ja tas ir redzams lapā pašreizējā ritināšanas pozīcijā. Tas būtu šādi:
jQuery.extend(jQuery.expr(':'), ( inview: function (el) ( var $e = $(el), $w = $(window), top = $e.offset().top, height = $e.outerHeight(true), windowTop = $w.scrollTop(), windowScroll = windowTop - height, windowHeight = windowTop + height + $w.height(); return (top > windowScroll && top < windowHeight); ) ));