jQuery pag-ubos - paraan na children()
Isang kasangkapan
Mahanap ang lahat ng mga anak na div na may klase na "selected" at i-set sa kulay asul:
$("div").children(".selected").css("color", "blue");
Definition and Usage
Ang method na children() ay nagbibigay ng lahat ng direktang anak na elemento ng piniling elemento.
Grammar
.children(selector)
| Parametro | Paglalarawan |
|---|---|
| selector | String value, naglalaman ng expression ng selector na tumutugma sa mga naipiling elemento. |
Detalyadong Paglalarawan
Kung ibinigay ang jQuery object na naglalarawan ng koleksyon ng DOM element, ang .children() method ay nagbibigay ng kapasidad na ma-retain ang mga elemento sa DOM tree at gumawa ng bagong jQuery object na gumawa ng katugma na elemento..find() Katulad ng .children() method, ngunit ang huli lamang ay naglalakbay sa DOM tree sa isang tanging antas.
Hindi naibabalik ng .children() ang mga text node; kung kailangan ng lahat ng mga anak na node na kasama ang text at comment nodes, gamitin ang .contents().
Ang paraan na ito ay tumatanggap ng isang expression ng selector bilang opsyonal na argumento, na may kapareho na uri ng parametro na pinasasampa sa $(). Kung gagamitin ang selector, itutestin nito kung ang elemento ay tumutugma sa expression, upang surunin ang mga elemento na ito.
Isipin ang pahina na may batay sa naka-angkat na listahan ng ilalim:
<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>
Kung magsimula kami mula sa listahan ng level-2, maaari naming makita ang kanyang mga anak na elemento:
$('ul.level-2').children().css('background-color', 'red');
Ang resulta ng ganitong linya ng kodigo ay ang proyekto A, B, C ay magiging kulay puti. Dahil hindi namin ginamit ang expression ng selector, ang ibinabalik na jQuery object ay naglalaman ng lahat ng mga anak na elemento. Kung gagamitin namin ang isang selector, ang ibinabalik lamang ay ang mga tumutugma na proyekto.
