2010-05-05 7 views
9

spécifique Comment ajouter un élément à un index spécifique des éléments enfants à l'aide de jQuery append e. si j'ai:jQuery Ajout d'un div à un

<div class=".container"> 
    <div class="item"><div> 
    <div class="item"><div> 
    <div class="item"><div> 
    <div class="item"><div> 
</div> 

et je veux ajouter un autre élément entre le deuxième et le troisième élément?

+5

On peut supposer que 'class = ".container" 'est une faute de frappe? Il est valide d'avoir '. .' dans un nom de classe, mais pas quelque chose que vous voudriez généralement faire. – bobince

Répondre

19

Il y a quelques options:

$("div.container div.item").eq(2).after($('your html')); 

$("div.container div.item:nth-child(3)").after($('your html')); 

$($("div.container div.item")[2]).after($('your html')); 

Les mêmes options, mais l'insertion dans la même position à l'aide "avant":

$("div.container div.item").eq(3).before($('your html')); 

$("div.container div.item:nth-child(4)").before($('your html')); 

$($("div.container div.item")[3]).before($('your html')); 
+1

+1 pour la méthode 'eq()' à la place du sélecteur ': eq' non standard CSS (et donc moins efficace). Cependant, faites attention avec ': nth-child'; Contrairement à 'eq()' et à la plupart des autres éléments, ses indices sont basés sur 1 (argh). – bobince

+0

Hommes Je l'oublie toujours. Merci pour l'information! – user875139

4

("div.container div.item:eq(1)").after("<element to insert>")

-1
$('.container').children()[1].append('whatever'); 
+1

cela ne fonctionnera pas puisque [1] retourne l'objet DOM natif qui ne connaît pas la fonction 'append()' – jAndy

+2

Je devrais éviter les questions jQuery. –

Questions connexes