si seleccionas un td podés ir al tr con parent, parents o closest pero depende de que tengas antes del td porque actuan diferente, cada uno tiene utilidad diferente
por ej: parent encuentra el tr si haces click en un td porque lo que le contiene antes a un td es un tr (el padre), pero si lo que buscas es un tr de una tabla principal y el td clickeado se encuentra en una tabla anidada ya no, va a encontrar solo el tr de la segunda tabla, u otra que puede ser que hagas click en un enlace y ahi el padre va a ser un td
parents si busca el padre y sigue buscando hasta hmmm ¿el abuelo? o sea busca un tr y si hay otro tr que lo contiene selecciona ese, o sea si clickeas en un enlace y le decis que busque un tr va a encontrar por mas que el enlace esté en un div después ese div esté en otro div y que a todo eso lo contenga un tr pero a la vez a ese tr lo contiene otra tabla y otra tabla y otra tabla jeje
closest busca el elemento mas cercano, o sea busca hasta el primer tr que lo contiene y listo
o sea que la mejor forma es parents
aca un ejemplo de lo que quise decir jeje
Código HTML:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$( function (){
$('.parent1').click( function (){
alert("$(this).parent().attr('bgcolor', 'red');");
$(this).parent().attr('bgcolor', 'red');
});
$('.parent2').click( function (){
alert("$(this).parent('tr').attr('bgcolor', 'blue');");
$(this).parent('tr').attr('bgcolor', 'blue');
});
$('.parents').click( function (){
alert("$(this).parents('tr').attr('bgcolor', 'green');");
$(this).parents('tr').attr('bgcolor', 'green');
});
$('.closest').click( function (){
alert("$(this).closest('tr').attr('bgcolor', 'blue');");
$(this).closest('tr').attr('bgcolor', 'blue');
});
});
</script>
</head>
<body>
<table border="1">
<tr>
<td>1</td><td class="parent1">parent, aca funciona</td>
</tr>
<tr>
<td>1</td><td><a class="parent2" href="#">parent, aca no funciona el padre de 'a' es un 'td'</a></td>
</tr>
<tr>
<td>2</td><td><a class="parents" href="#">parents</a></td>
</tr>
<tr>
<td>3</td><td><a class="closest" href="#">closest</a></td>
</tr>
<tr>
<td>3</td>
<td>
<table><tr>
<td>
<a class="closest" href="#">closest dentro de un tr</a>
</td>
</tr></table>
</tr>
<tr>
<td>3</td>
<td>
<table><tr>
<td>
<div><a class="parents" href="#">parents dentro de un tr, desde el link pasa por el div despues por un tr y de ahi hasta el ultimo tr</a></div>
</td>
</tr></table>
</tr>
</table>
</body>
</html>