Consigue un segundo hijo usando jQuery

$(t).html()

devoluciones

<td>test1</td><td>test2</td>

Quiero recuperar el segundo tddel $(t)objeto. Busqué una solución pero nada me funcionó. ¿Alguna idea de cómo obtener el segundo elemento?

agarra al segundo niño:

$(t).children().eq(1);

o agarra al segundo hijo <td>:

$(t).children('td').eq(1);

Aquí hay una solución que quizás sea más clara de leer en el código:

Para obtener el segundo hijo de una lista desordenada:

   $('ul:first-child').next()

Y un ejemplo más elaborado: este código obtiene el texto del atributo 'title' del segundo elemento secundario de la UL identificado como 'my_list':

   $('ul#my_list:first-child').next().attr("title")

En este segundo ejemplo, puede deshacerse de la 'ul' al comienzo del selector, ya que es redundante, porque una ID debe ser exclusiva de una sola página. Está ahí solo para agregar claridad al ejemplo.

Nota sobre rendimiento y memoria , estos dos ejemplos son buenos resultados, porque no hacen que jquery guarde una lista de elementos ul que tuvieron que ser filtrados después.

Cómo es esto:

$(t).first().next()

ACTUALIZACIÓN PRINCIPAL:

Además de lo hermosa que se ve la respuesta, también debe pensar en el rendimiento del código. Por lo tanto, también es relevante saber qué hay exactamente en la $(t)variable. ¿Es una matriz de <TD>o es un <TR>nodo con varios <TD>sdentro? Para ilustrar mejor el punto, vea los puntajes de jsPerf en una <ul>lista con 50 <li>hijos:

http://jsperf.com/second-child-selector

El $(t).first().next()método es el más rápido aquí, con diferencia.

Pero, por otro lado, si toma el <tr>nodo y encuentra a los <td>niños y ejecuta la misma prueba, los resultados no serán los mismos.

Espero eso ayude. :)

No lo vi mencionado aquí, pero también puede usar selectores de especificaciones CSS. Ver los documentos

$('#parentContainer td:nth-child(2)')

Prueba esto:

$("td:eq(1)", $(t))

o

$("td", $(t)).eq(1)

Además de usar los métodos jQuery, puede usar la cellscolección nativa que <tr>le proporciona.

$(t)[0].cells[1].innerHTML

Suponiendo que tes un elemento DOM, puede omitir la creación del objeto jQuery.

t.cells[1].innerHTML

_{Es sorprendente ver que nadie mencionó la forma nativa de JS de hacer esto ...}

Sin jQuery:

Simplemente acceda a la childrenpropiedad del elemento padre. Devolverá una colección HTMLC en vivo de elementos secundarios a los que se puede acceder mediante un índice. Si quieres tener el segundo hijo:

parentElement.children[1];

En su caso, algo como esto podría funcionar: (ejemplo)

var secondChild = document.querySelector('.parent').children[1];

console.log(secondChild); // <td>element two</td>

<table>
    <tr class="parent">
        <td>element one</td>
        <td>element two</td>
    </tr>
</table>

También puede usar una combinación de selectores CSS3 / querySelector()y utilizar :nth-of-type(). Este método puede funcionar mejor en algunos casos, porque también puede especificar el tipo de elemento, en este caso td:nth-of-type(2) (ejemplo)

var secondChild = document.querySelector('.parent > td:nth-of-type(2)');

console.log(secondChild); // <td>element two</td>

Utilizar el .find()método

$(t).find("td:eq(1)");

td:eq(x) // x is index of child you want to retrieve. eq(1) means equal to 1. //1 denote second element

Puede usar dos métodos en jQuery como se indica a continuación:

Usando jQuery: nth-child Selector Ha puesto la posición de un elemento como argumento, que es 2, ya que desea seleccionar el segundo elemento li.

$( "ul li:nth-child(2)" ).click(function(){
  //do something
});

Usando jQuery: eq () Selector

Si desea obtener el elemento exacto, debe especificar el valor de índice del elemento. Un elemento de lista comienza con un índice 0. Para seleccionar el segundo elemento de li, debe usar 2 como argumento.

$( "ul li:eq(1)" ).click(function(){
  //do something
});

Ver Ejemplo: Obtener el segundo elemento secundario de la lista en jQuery