pensé que esto podría ser una manera rápida para eliminar el contenido de una tabla muy grande (3000 filas):jQuery - forma más rápida de eliminar todas las filas de una tabla muy grande
$jq("tbody", myTable).remove();
Pero se toman alrededor de las cinco segundos para completar en firefox ¿Estoy haciendo algo estúpido (aparte de tratar de cargar 3000 filas en un navegador)? ¿Hay una forma más rápida de hacerlo?
$("#your-table-id").empty();
Eso es lo más rápido que obtienes.
Dos cuestiones que puedo ver aquí:
El vacío() y eliminar() de jQuery realmente hacen un poco de trabajo. Vea el JavaScript Function Call Profiling de John Resig para saber por qué.
La otra cosa es que para grandes cantidades de datos tabulares puede considerar una biblioteca de cuadrícula de datos como la excelente DataTables para cargar sus datos sobre la marcha del servidor, aumentando el número de llamadas de red, pero disminuyendo el tamaño de esas llamadas. Tenía una tabla muy complicada con 1500 filas que se volvieron bastante lentas, cambiando a la nueva tabla basada en AJAX hizo que estos mismos datos parecieran bastante rápidos.
Gracias artlung. Hacer algo como eso en realidad, obtener todos los datos a la vez del servidor, pero solo dibujar las filas de la tabla cuando sea necesario. – morgancodes
Suena como una buena llamada. Me pregunto si preocuparse por la cantidad de filas en una tabla en un navegador siempre será un problema, o si la memoria de la mayoría de las computadoras aumenta, esto será un problema menor. – artlung
La memoria no es un problema con la cantidad de datos que estoy cargando. El cuello de botella es la manipulación DOM. – morgancodes
si desea eliminar sólo es rápido .. se puede hacer, como a continuación ..
$("#tableId tbody tr").each(function(){
this.parentNode.removeChild(this);
});
pero, no puede haber algunos elementos por eventos binded en la tabla,
en ese caso ,
código anterior no es prevenir pérdida de memoria en el IE ... TT y no es rápido en FF ...
siento ....
Es mejor evitar cualquier tipo de bucles, basta con retirar todos los elementos directamente como esto:
$("#mytable > tbody").html("");
Usted podría intentar esto ...
var myTable= document.getElementById("myTable");
if(myTable== null)
return;
var oTBody = myTable.getElementsByTagName("TBODY")[0];
if(oTBody== null)
return;
try
{
oTBody.innerHTML = "";
}
catch(e)
{
for(var i=0, j=myTable.rows.length; i<j; i++)
myTable.deleteRow(0);
}
funciona este para mí:
1- Agregar clase para cada fila "RemoveRow"
2- en el jQuery
$(".removeRow").remove();
Hmmm. Frustrante. Yo pensaría que eliminar sería mucho más rápido que la inserción. Me hace querer hacer cosas realmente feas, como esconder la mesa y crear una nueva cuando quiero actualizarla. – morgancodes
Sí, bueno ... HTML no se creó para mostrar 3k filas en una página :) ¿No se te ocurre ninguna solución paginada? Eso lo haría mucho más rápido. Claro que exigiría más trabajo, pero será una experiencia de usuario mucho más rica. – Seb
Lo construí paginado originalmente, pero el cliente insistió en desplazarse :(La buena noticia es que 3k filas es un caso marginal. Más común será unos cientos. – morgancodes