jQuery-bearbetning - children() metod
Exempel
Hitta alla underelement av div med klassnamnet "selected" och sätt dem till blått:
$("div").children(".selected").css("color", "blue");
Definition och användning
children() metoden returnerar alla direkta underelement till det valda elementet.
Syntaks
.children(selector)
| Parameter | Beskrivning |
|---|---|
| selector | Strängvärde, innehållande ett valuttryck som matchar elementen. |
Detaljerad förklaring
Om en jQuery-objekt som representerar en samling DOM-element ges, tillåter .children() metoden oss att hämta dessa element från DOM-trädet och skapa en ny jQuery-objekt med matchande element..find() Likt .children() metoden, men den senare går endast en nivå ner i DOM-trädet.
Observera att, som de flesta jQuery-metoder, returnerar .children() inte textnoder; om du behöver få alla undernoder inklusive text- och kommentarnoder, använd .contents().
Denna metod accepterar ett valuttryck som valfri parameter, av samma typ som parametern vi skickar till $(). Om valuttrycket tillämpas kommer det att testas om elementen matchar uttrycket, för att filtrera dessa element.
Tänk på denna sida med grundläggande nästlade listor:
<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>
Om vi börjar med level-2-listan kan vi hitta dess underelement:
$('ul.level-2').children().css('background-color', 'red');
Detta rättsverkets resultat är att projekt A, B, C får en röd bakgrund. Eftersom vi inte har använt ett valuttryck, innehåller den returnerade jQuery-objektet alla underelement. Om man använder ett valuttryck, kommer det bara att inkludera matchande projekt.
