Obter o segundo filho usando jQuery

$(t).html()

retorna

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

Eu quero recuperar o segundo tddo $(t)objeto. Eu procurei uma solução, mas nada funcionou para mim. Alguma idéia de como obter o segundo elemento?

pegue o segundo filho:

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

ou, pegue o segundo filho <td>:

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

Aqui está uma solução que talvez seja mais clara de se ler no código:

Para obter o segundo filho de uma lista não ordenada:

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

E um exemplo mais elaborado: Esse código obtém o texto do atributo 'title' do segundo elemento filho do UL identificado como 'my_list':

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

Neste segundo exemplo, você pode se livrar do 'ul' no início do seletor, pois é redundante, porque um ID deve ser exclusivo para uma única página. Está lá apenas para adicionar clareza ao exemplo.

Nota sobre desempenho e memória , esses dois exemplos são de bom desempenho, porque não fazem o jquery salvar uma lista de elementos ul que precisaram ser filtrados posteriormente.

Como é isso:

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

ATUALIZAÇÃO PRINCIPAL:

Além de parecer bonita a resposta, você também deve refletir sobre o desempenho do código. Portanto, também é importante saber o que exatamente está na $(t)variável. É uma matriz <TD>ou é um <TR>nó com várias <TD>sdentro dela? Para ilustrar melhor o ponto, consulte as pontuações do jsPerf em uma <ul>lista com 50 <li>filhos:

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

O $(t).first().next()método é o mais rápido aqui, de longe.

Mas, por outro lado, se você pegar o <tr>nó e encontrar os <td>filhos e executar o mesmo teste, os resultados não serão os mesmos.

Espero que ajude. :)

Não o vi mencionado aqui, mas você também pode usar seletores de especificações CSS. Veja os documentos

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

Tente o seguinte:

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

ou

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

Além de usar métodos jQuery, você pode usar a cellscoleção nativa <tr>fornecida.

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

Supondo que tseja um elemento DOM, você pode ignorar a criação do objeto jQuery.

t.cells[1].innerHTML

_{É surpreendente ver que ninguém mencionou a maneira JS nativa de fazer isso.}

Sem jQuery:

Basta acessar a childrenpropriedade do elemento pai. Ele retornará uma HTMLCollection ao vivo de elementos filhos que pode ser acessada por um índice. Se você deseja obter o segundo filho:

parentElement.children[1];

No seu caso, algo como isso poderia funcionar: (exemplo)

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>

Você também pode usar uma combinação de seletores CSS3 / querySelector()e utilizar :nth-of-type(). Este método pode funcionar melhor em alguns casos, porque você também pode especificar o tipo de elemento, neste caso td:nth-of-type(2) (exemplo)

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

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

Use .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

Você pode usar dois métodos no jQuery, conforme indicado abaixo:

Usando o jQuery: n-filho Seletor Você colocou a posição de um elemento como argumento, que é 2, conforme você deseja selecionar o segundo elemento li.

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

Usando o seletor jQuery: eq ()

Se você deseja obter o elemento exato, precisa especificar o valor do índice do item. Um elemento da lista começa com um índice 0. Para selecionar o segundo elemento de li, você deve usar 2 como argumento.

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

Consulte o Exemplo: Obter o segundo elemento filho da lista no jQuery