jQuery :nth-child() Selektor
Beispiel
Wählen Sie jedes <p>-Element aus, das das dritte untergeordnete Element seines übergeordneten Elements ist:
$("p:nth-child(3)")
Definition und Verwendung
Der Selektor :nth-child( n ) wählt alle Elemente aus, die das n -te Kind ihres Elternteils sind, unabhängig vom Typ.
Tipp: Verwenden Sie den Selektor :nth-of-type() , um alle Elemente auszuwählen, die das n -te Kind eines bestimmten Typs ihres Elternelements sind.
Syntax
:nth-child(n|even|odd|formula)
| Parameter | Description |
|---|---|
| n | The index of each child to match. Must be a number. The first element has the index number 1. |
| even | Selects each even child element |
| odd | Selects each odd child element |
| formula | Specifies which child element(s) to be selected with a formula (an + b).
Example: p:nth-child(3n+2) selects each 3rd paragraph, starting at the 2nd child element |
Probieren Sie es selbst aus - Beispiel
ist So wählen Sie jedes <p>-Element aus, das das zweite untergeordnete Element aller <div>-Elemente ist.
So verwenden Sie eine Formel ( an + b ), um verschiedene untergeordnete Elemente auszuwählen.
Wie man gerade und ungerade verwendet, um verschiedene untergeordnete Elemente auszuwählen.
Der Unterschied zwischen p:nth-child(2), p :nth-last-child(2), p:nth-of-type(2) und p:nth-of-last-type(2).