jQuery $(...).empty().append(...)在几次执行后减慢整个页面

Question

我正在使用$('#...').empty().append(html)-like构造来更新AJAX success上的内容。在5-6个请求之后，整个页面随着每个请求变得越来越慢(：悬停需要更多的时间才能出现，JS变慢，等等)。这在任何浏览器中都会发生。加载的内容越多，速度就会越慢。

我想我错过了一些清理工作。有什么建议吗？

代码：

query = function (uri, data) {
    $.ajax({
        url: uri,
        cache: false,   
        data: data,
        success: processResponse,
        method: data?'POST':'GET',
    });
    return false;
}

processResponse = function (data) {
    $('#rightplaceholder').empty();
    $('#rightplaceholder').append(data);
}

$('#button').click( function () { query('/foo'); } );

我还尝试禁用所有与加载此片段没有直接关系的JS --但没有成功。

Answer 1

听起来像是由您正在运行的任何补充JavaScript (或您正在加载的数据)引起的内存泄漏。

删除所有不必要的代码，或者当从页面中删除由其他代码添加的元素时，请确保使用他们的API来执行此操作，以便它可以有机会进行清理。

Answer 2

尝试使用$('#rightplaceholder').html(data);，将两个DOM操作合并为一个。

另外:将cache: false更改为true，以加速多个AJAX请求。如果你没有提交数据，那么就没有理由不缓存结果。