Selector ng jQuery

Ang selector ay nagbibigay-daan sa iyo na gumawa ng operasyon sa grupo ng elemento o sa isang elemento lamang.

Selector ng jQuery

Sa mga nakaraang kabanata, ipinapakita namin ang ilang mga halimbawa kung paano piliin ang mga elemento ng HTML.

Kahit na ang pinakamahalagang punto ay ang pag-aaral kung paano ma-aakma ang jQuery selector upang maayos na piliin ang mga elemento na gusto mong gamitin ang epekto.

Ang jQuery element selector at attribute selector ay nagbibigay-daan sa iyo na piliin ang HTML element sa pamamagitan ng tag name, attribute name o content.

Ang selector ay nagbibigay-daan sa iyo na gumawa ng operasyon sa grupo ng HTML element o sa isang single element.

Sa terminolohiya ng HTML DOM:

Ang selector ay nagbibigay-daan sa iyo na gumawa ng operasyon sa grupo ng DOM element o sa isang DOM na single node.

jQuery Element Selector

Ang jQuery ay gumagamit ng CSS selector para sa pagpili ng HTML element.

$("p") ay pinapili ang <p> element.

$("p.intro") ay pinapili ang lahat ng <p> element na may class="intro".

$("p#demo") ay pinapili ang lahat ng <p> element na may id="demo".

jQuery Attribute Selector

Ang jQuery ay gumagamit ng XPath expression para sa pagpili ng element na may binigay na attribute.

$("[href]") ay pinapili ang lahat ng element na may href attribute.

$("[href='#']") ay pinapili ang lahat ng element na may href value na kahit na "#".

$("[href!='#']") ay pinapili ang lahat ng element na may href value na hindi pa "#".

$("[href$='.jpg']") ay pinapili ang lahat ng element na may href value na nagtatapos sa ".jpg".

jQuery CSS Selector

Ang jQuery CSS selector ay maaaring gamitin para baguhin ang CSS attribute ng HTML element.

Ang sumusunod na halimbawa ay nagbabago ng kulay ng background ng lahat ng <p> element sa kulay red:

Halimbawa

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

Subukan natin

Mga halimbawa ng selector

Mga pangkalahatang balita Paglalarawan
$(this) ang kasalukuyang HTML element
$("p") ang lahat ng <p> element
$("p.intro") ang lahat ng <p> element na may class="intro"
$(".intro") ang lahat ng elementong may class="intro"
$("#intro") ang element na may id="intro"
$("ul li:first") ang unang <li> element ng bawat <ul>
$("[href$='.jpg']") ang lahat ng elementong may href attribute na may value na nagtatapos sa ".jpg"
$("div#intro .head") ang lahat ng elementong class="head" sa <div> element na may id="intro"

Para sa kumpletong reference manual, bisita natin ang aming jQuery Selector Reference Manual。