jquery - найшвидший спосіб видалити всі рядки з дуже великої таблиці

Я думав, що це може бути швидкий спосіб видалити вміст дуже великої таблиці (3000 рядків):

$jq("tbody", myTable).remove();

Але це займає близько п’яти секунд для завершення роботи у firefox. Я роблю щось німе (крім спроби завантажити 3000 рядків у браузер)? Чи є швидший спосіб це зробити?

$("#your-table-id").empty();

Це так швидко, як ви отримуєте.

Краще уникати будь-яких петель, просто видаліть усі елементи безпосередньо так:

$("#mytable > tbody").html("");

Використання від'єднання - це величина швидше, ніж будь-яка інша відповідь тут:

$('#mytable').find('tbody').detach();

Не забудьте повернути елемент tbody назад у таблицю, оскільки від'єднання видалило його:

$('#mytable').append($('<tbody>'));  

Також зверніть увагу, що при розмові ефективність $(target).find(child)синтаксису швидша, ніж $(target > child). Чому? Сизл!

Час, що минув до спорожнення 3161 рядків таблиць

За допомогою методу Detach () (як показано в моєму прикладі вище):

• Firefox: 0,027 с
• Хром: 0,027 с
• Край: 1,73 с
• IE11: 4.02 с

За допомогою методу empty ():

• Firefox: 0,055 с
• Хром: 0,052 с
• Край: 137,99 с (цілком можна заморозити)
• IE11: Замерзає і ніколи не повертається

$("#myTable > tbody").empty();

Це не торкнеться заголовків.

Два питання, які я можу побачити тут:

1. Методи empty () і remove () jQuery насправді роблять досить багато роботи. Знайомства Резіг в JavaScript виклик функції Профілювання чому.

2. Інша справа в тому , що для великої кількості табличних даних можна розглянути DataGrid бібліотеки , такі як відмінні DataTables для завантаження даних на льоту з сервера, збільшення числа Інтернет-дзвінків, але зменшення розміру цих викликів. У мене була дуже складна таблиця з 1500 рядків, яка стала досить повільною, перехід на нову таблицю на основі AJAX зробив ці самі дані видатися досить швидкими.

якщо ви хочете видалити лише швидко .. Ви можете зробити, як показано нижче ...

$( "#tableId tbody tr" ).each( function(){
  this.parentNode.removeChild( this ); 
});

але, в таблиці можуть бути прив'язані до подій елементи,

в такому разі,

наведений вище код не запобігає витоку пам'яті в IE ... TT і не швидко в FF ...

вибачте ....

це працює для мене:

1- додати клас для кожного рядка "removeRow"

2 - у jQuery

$(".removeRow").remove();

Ви можете спробувати це ...

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);
}