如何提高性能..？

Question

function removeTds() {
    var elements = $('#goldBarList tr:not(:eq(0))').filter(':has(:checkbox:checked):lt(50)');
    var count = elements.length;
    elements.each(function() {
        grossWeightTotal = grossWeightTotal - $('#goldBarList tr:eq(' + $(this).index() + ') td:eq(8)').text();
        netWeightTotal = netWeightTotal - $('#goldBarList tr:eq(' + $(this).index() + ') td:eq(9)').text();
        fineOunceTotal = fineOunceTotal - $('#goldBarList tr:eq(' + $(this).index() + ') td:eq(10)').text();
    });
    elements.remove();
    if(count === 50) window.setTimeout(removeTds, 1);
}
removeTds();

上面的代碼導致“停止運行此腳本？” 提示。 我有4000條記錄。

Answer 1

您的代碼本質上是緩慢且可優化的（例如，緩存$(this).index() ），但是最大的問題是，如果您有50 * N條記錄（例如4000條記錄），則要求瀏覽器每1毫秒運行一次該函數。 ）。

只需一次性清潔。

例如 ：

function removeTds() {
    var elements = $('#goldBarList tr:not(:eq(0))').filter(':has(:checkbox:checked)');
    elements.each(function() {
        var index = $(this).index();
        grossWeightTotal = grossWeightTotal - $('#goldBarList tr:eq(' + index + ') td:eq(8)').text();
        netWeightTotal = netWeightTotal - $('#goldBarList tr:eq(' + index + ') td:eq(9)').text();
        fineOunceTotal = fineOunceTotal - $('#goldBarList tr:eq(' + index + ') td:eq(10)').text();
    });
    elements.remove();
}
removeTds();

如果要在更改復選框時重新制作清潔紙，請添加以下內容：

$('input[type="checkbox"]').change(removeTds);

當然，您也可以綁定到按鈕：

$('#removeButton').change(removeTds);