jQuery elimina todas las filas de la tabla excepto la primera
Usando jQuery, ¿cómo elimino todas las filas de una tabla excepto la primera? Este es mi primer intento de utilizar selectores de índice. Si entiendo los ejemplos correctamente, lo siguiente debería funcionar:
$(some table selector).remove("tr:gt(0)");
que leería como "Envuelva alguna tabla en un objeto jQuery, luego elimine todos los elementos 'tr' (filas) donde el índice de elementos de dichas filas sea mayor que cero". En realidad, se ejecuta sin generar error, pero no elimina ninguna fila de la tabla.
¿Qué me falta y cómo soluciono este problema? Por supuesto, podría usar JavaScript puro, pero me estoy divirtiendo tanto con jQuery que me gustaría resolver esto usando jQuery.
Esto debería funcionar:
$(document).ready(function() {
$("someTableSelector").find("tr:gt(0)").remove();
});
Creo que esto es más legible dada la intención:
$('someTableSelector').children( 'tr:not(:first)' ).remove();
El uso de elementos secundarios también soluciona el caso en el que la primera fila contiene una tabla al limitar la profundidad de la búsqueda.
Si tuvieras un elemento TBODY, puedes hacer esto:
$("someTableSelector > tbody:last").children().remove();
Si tienes elementos THEAD o TFOOT necesitarás hacer algo diferente.
Otra forma de lograr esto es usar la función vacía() de jQuery con los elementos thead y tbody en su tabla.
Ejemplo de una tabla:
<table id="tableId">
<thead>
<tr><th>Col1</th><th>Col2</th></tr>
</thead>
<tbody>
<tr><td>some</td><td>content</td></tr>
<tr><td>to be</td><td>removed</td></tr>
</tbody>
</table>
Y el comando jQuery:
$("#tableId > tbody").empty();
Esto eliminará todas las filas contenidas en el elemento tbody de su tabla y mantendrá el elemento thead donde debería estar su encabezado. Puede resultar útil cuando desea actualizar solo el contenido de una tabla.
Si fuera yo, probablemente lo reduciría a un solo selector:
$('someTableSelector tr:not(:first)').remove();
