obtener el n-ésimo hijo de un elemento en jquery

Question

Tengo una clase de múltiples elementos 'DIV' y en su interior hay una lista de elementos 'p'. Ver más abajo:

<div class="container"> 
    <p>This is content 1</p> 
    <p>This is content 2</p> 
    <p>This is content 3</p> 
</div> 
<div class="container"> 
    <p>This is content 1</p> 
    <p>This is content 2</p> 
    <p>This is content 3</p> 
</div> 

Aquí está mi código de jQuery en llamar a los elementos de la 'p' a través de la libración:

$('.container').children('p').hover(function(){ 
    //get the nth child of p from parent class 'container' 
}); 

¿Cómo puedo obtener el número de niños enésima del elemento 'p' de su clase de contenedor primario 'envase'?

Al igual que si se pasa

Este es el contenido de 1

que debe dar lugar a la salida como 1;

Gracias!

Answer 1

Puede usar jQuery's index function para eso. Se da a conocer en el que el elemento dado es relativa a sus hermanos:

var index = $(this).index(); 

Live example | source

Los índices están basados ​​en 0, así que si usted está buscando un índice basado en 1 (por ejemplo, donde el primero es 1 en lugar de 0), sólo tiene que añadir uno a ella:

var index = $(this).index() + 1; 

---

Si no está utilizando jQuery y se encontró con esta pregunta y respuesta (el OP estaba usando jQuery), esto también es bastante simple de hacer sin él. nth-child sólo se considera elementos, por lo que:

function findChildIndex(node) { 
    var index = 1;       // nth-child starts with 1 = first child 
    // (You could argue that you should throw an exception here if the 
    // `node` passed in is not an element [e.g., is a text node etc.] 
    // or null.) 
    while (node.previousSibling) { 
     node = node.previousSibling; 
     if (node && node.nodeType === 1) { // 1 = element 
      ++index; 
     } 
    } 
    return index; 
} 

Answer 2

utilizar la versión sin parámetros del método .index() para encontrar la posición del elemento con respecto a sus hermanos:

$('.container').children('p').hover(function() { 
    var index = $(this).index() + 1; 
}); 

Tenga en cuenta que el resultado de .index() habrá basado en cero, no se basa-uno, de ahí el + 1

Answer 3

$('.container').children('p').hover(function(){ 
    //get the nth child of p from parent class 'container' 
    var n = 1; 
    var child = $(this).parent().find("p:eq("+n+")"); 
}); 

¡Debería funcionar!

O si desea conocer el índice del elemento cernía:

$('.container').children('p').each(function(index,element) { 
    // use closure to retain index 
    $(element).hover(function(index){ 
     return function() { alert(index); } 
    }(index); 
} 

Ver http://api.jquery.com/each/