jQuery: exemple d'utilisation du sélecteur nième enfant_jquery

L'exemple de cet article décrit l'utilisation du sélecteur :nth-child dans jQuery. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Ce sélecteur correspond au Nième élément enfant ou impair-pair sous son élément parent.
Le sélecteur :eq(index) ne correspond qu'à un seul élément, tandis que le sélecteur :nth-child correspondra aux éléments enfants de chaque élément parent.
:nth-child commence à 1 et :eq() commence à 0.
Structure grammaticale :

Copier le code Le code est le suivant :

$(":ntième-enfant")

Ce sélecteur est généralement utilisé en conjonction avec d'autres sélecteurs, tels que les sélecteurs de classe, les sélecteurs d'éléments, etc. Par exemple :

Copier le code Le code est le suivant :

$("li:nth-child(2)").css ("couleur", "bleu")

Le code ci-dessus peut définir la couleur de la police du deuxième élément li sous l'élément parent sur le bleu. Il est également possible de calculer des éléments enfants impairs et pairs d'un élément parent. Par exemple :

Copier le code Le code est le suivant :

$("li:nth-child(even)").css ("couleur", "bleu")

Le code ci-dessus peut définir la couleur de la police dans l'élément li pair sous l'élément parent sur le bleu.

Remarque : Il est nécessaire d'expliquer le concept en combinaison avec le code ci-dessus. L'élément parent mentionné ici n'est pas li, mais l'élément parent de li.
Beaucoup de gens pensent souvent à tort qu'il correspond au dernier élément parmi les éléments enfants de l'élément li.

Exemple de code :

Copier le code Le code est le suivant :

• Tutoriel ASP


• Tutoriel ASP.NET


• ;Tutoriel PHP

• tutoriel html


• Tutoriel CSS DIV


• Tutoriel jQUERY


• Tutoriel jAVAScript

Cliquez pour voir l'effet

J'espère que cet article sera utile à la programmation jQuery de chacun.