2009-04-01 16 views
1

Par exemple, j'ai un div avec un identifiant (disons "the_div"). Cette div contient une liste non ordonnée, et cette liste contient 5 éléments.Jquery - Obtenir le xième élément

Comment est-ce que j'ajouterais une classe au troisième élément de liste, sans aucun des éléments de liste ayant une classe attachée à eux? Edit: Mieux encore, comment changer le texte de l'élément de la liste pour qu'il soit égal à quel élément de numéro?

Merci.

Répondre

2

Pour votre premier problème, vous pouvez utiliser eq, qui est 0 basé:

$('ul li', '#thediv').eq(2).addClass('whatever'); // add class to 3rd item 

Pour votre deuxième problème, vous pouvez utiliser each pour parcourir tous les éléments de la liste. La fonction de rappel passe un argument contenant l'indice de l'élément courant dans l'ensemble:

$('ul li', '#thediv').each(function(i) { 
    $(this).text(i); // update each list item with its index, 0 based. 
}); 
+0

Je dirais .text (i) pas .html (i). +1 cependant. – strager

+0

Eh bien, jQuery le comprend évidemment, mais point pris. Édité. –

+0

Mmm. En lisant la documentation, la seule différence entre html() et text() est que text() échappe au HTML. Cela n'a évidemment pas d'importance ici. Existe-t-il des «meilleures pratiques» quant à savoir quand utiliser l'un ou l'autre? Je me sens comme html() est probablement pour les divs la plupart du temps, mais c'est juste une intuition. –

4

Ou ...

$('#the_div ul li:eq(2)').addClass('className'); 

Vous pouvez combiner les sélecteurs ensemble - si vous préférez :)

+0

Je pense que c'est purement une question de préférence. Je trouve ces longues chaînes de sélection disgracieuses et les séparer montre l'intention plus clairement et est plus rapide. –

+0

Préférence Oui ... Je trouve qu'ils sont généralement un peu similaire à CSS, donc je préfère cette cohérence ..;) – markt

+0

+1, je pense que cette solution est beaucoup plus agréable. Moins de bruit. – cdmckay