Javascript Girl
  1. Javascript Girl
  3. Application de classe à chaque élément de la 3ème liste
Intereting Posts
Minimiser (pas transpile) code ES2015 avec Gulp AngularJS compose les données $ http post Obtenir le type d'entrée = "fichier" lorsque plusieurs fichiers sont sélectionnés Comment remplacer tous MAIS la première occurrence d'un motif en chaîne Object.defineProperty get / set closure Comment forcer les mises à jour UI dans le navigateur alors que de longs calculs javascript sont en cours? Carte javascript dans la brochure comment actualiser Question de ChromeAnimationFrame Comment convertir ce Regex PHP en Javascript Regex? L'approvisionnement en javascript local dans uiwebview ios Pourquoi le lien Supprimer ne fonctionne-t-il pas dans ce projet Ruby on Rail? Obtenir des données de profil d'utilisateur Facebook avec Javascript Entrée du sélecteur Jquery ') Problèmes avec CORS. Flasque <-> AngularJS Les fonctionnalités JavaScript fonctionnent sur localhost mais pas lors de leur déploiement à Heroku

Application de classe à chaque élément de la 3ème liste

J'ai le script suivant. En ce moment, il sélectionne le 3ème élément de ma liste et ne lui donne aucune marge. Le problème est-ce que cela ne l'est qu'une seule fois, est-ce que je peux faire en sorte que cela se produise à chaque 3ème élément de la liste? J'ai essayé d'utiliser .each mais je ne pouvais pas le faire fonctionner avec succès. 

 <script> $(document).ready(function() { $("#contentlist li:eq(2)").css({marginRight: '0'}); }); </script>

La pseudo-classe du nth-child utilisant 3n peut le faire. 

 $( '#contentlist li:nth-child(3n)' ).css({marginRight: '0'});

Demo: http://jsfiddle.net/ThinkingStiff/gjvpR/

HTML: 

 <ul id="contentlist"> <li>1</li> <li>2</li> <li>3</li> <li>1</li> <li>2</li> <li>3</li> </ul>

Scénario: 

 $( '#contentlist li:nth-child(3n)' ).css( {marginLeft: '20px'} );

Sortie:

Entrez la description de l'image ici

Utilisez le sélecteur CSS nth-child : 

 $("#contentlist li:nth-child(3n)").css({marginRight: '0'});

Demo (avec des couleurs plutôt que des marges): http://jsfiddle.net/ambiguous/DRCLF/