jQuery: Verwendung des n-ten untergeordneten Selektors example_jquery

Das Beispiel in diesem Artikel beschreibt die Verwendung des :nth-child-Selektors in jQuery. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Dieser Selektor entspricht dem N-ten untergeordneten oder gerade-ungerade-Element unter seinem übergeordneten Element.
Der :eq(index)-Selektor stimmt nur mit einem Element überein, während der :nth-child-Selektor untergeordnete Elemente für jedes übergeordnete Element abgleicht.
:nth-child beginnt bei 1 und :eq() beginnt bei 0.
Grammatikstruktur:

Code kopieren Der Code lautet wie folgt:

$(":nth-child")

Dieser Selektor wird im Allgemeinen in Verbindung mit anderen Selektoren verwendet, z. B. Klassenselektoren, Elementselektoren usw. Zum Beispiel:

Code kopieren Der Code lautet wie folgt:

$("li:nth-child(2)").css („Farbe“, „blau“)

Der obige Code kann die Schriftfarbe im zweiten li-Element unter dem übergeordneten Element auf Blau setzen. Es ist auch möglich, ungerade und gerade untergeordnete Elemente eines übergeordneten Elements zu berechnen. Zum Beispiel:

Code kopieren Der Code lautet wie folgt:

$("li:nth-child(even)").css („Farbe“, „blau“)

Der obige Code kann die Schriftfarbe im geraden li-Element unter dem übergeordneten Element auf Blau setzen.

Hinweis: Es ist notwendig, das Konzept in Kombination mit dem obigen Code zu erklären. Das hier erwähnte übergeordnete Element ist nicht li, sondern das übergeordnete Element von li.
Viele Leute denken oft fälschlicherweise, dass es mit dem letzten Element unter den untergeordneten Elementen des li-Elements übereinstimmt.

Beispielcode:

Code kopieren Der Code lautet wie folgt:

• ASP-Tutorial


• ASP.NET-Tutorial


• ;PHP-Tutorial

• html-Tutorial


• DIV-CSS-Tutorial


• jQUERY-Tutorial


• jAVAScript-Tutorial

Klicken Sie, um den Effekt zu sehen

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.