web-dev-qa-db-fra.com

Existe-t-il un sélecteur CSS standard similaire à: eq () dans jQuery?

Je ne sais pas s'il existe un sélecteur CSS peut faire la même chose que la ligne ci-dessous (code jQuery):

.tab_cadre_central .top:eq(0) table tbody tr td table tbody tr:eq(3)

J'ai essayé en CSS quelque chose comme ceci:

.tab_cadre_central .top::nth-child(0) table tbody tr td table tbody nth-child:eq(3) {
    display:none;
}

mais ça n'a pas marché.

20
user2077308

Alors que :eq() de jQuery utilise une indexation basée sur 0, :nth-child() utilise une indexation basée sur 1, vous devez donc incrémenter vos index de manière appropriée:

.tab_cadre_central .top:nth-child(1) table tbody tr td table tbody tr:nth-child(4)

Mais vous devriez vraiment penser à refactoriser ce sélecteur ...


⚠ Il convient de noter que bien que :eq() et :nth-child() puissent se comporter de la même manière - ils ne sont certainement pas les mêmes. :eq() sélectionnera l'élément n + 1 e dans l'ensemble tandis que :nth-child() sélectionnera tous les éléments de l'ensemble qui sont les n e enfant de leurs parents respectifs. ⚠

<div>
    <span></span>
    <span></span>
</div>
<div>
    <span></span>
</div>

Le sélecteur div span:nth-child(1) récupérera deux éléments, tandis que div span:eq(0) n'en sélectionnera qu'un.

41
Dennis