javascript - jQuery $(...).empty().append(...) 在多次执行后会减慢整个页面的速度

Question

我正在使用$('#...').empty().append(html)类似构造更新内容就 AJAX 成功。在 5-6 个请求之后，每个请求整个页面变得越来越慢(:hover 需要更多时间才能出现，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

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

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