如何避免在巨大的 ajax 页面上进行 Jquery 解析/清理

How to avoid Jquery parsing/cleaning up on huge ajax page?

本文关键字：Jquery 解析 清理 何避免 巨大 ajax      更新时间：2023-09-26

我有一个页面通过Ajax请求大部分内容。返回的 html 由 2 个表格组成，我在页面上呈现。我当前使用的代码：

    $.post(myUrl, $('form').serialize(), function (data)
    {
        var $data = $(data);
        $('#HeaderIndholdPanel').html($data.find('#GridView1'));
        $('#SvarIndholdPanel').html($data.find('#Table1'));
    }, 'html');

它不会变得更容易，但它会变得更快吗？第二个表几乎是 4 MB，所以这解释了为什么它很慢 - 两个表必须从一个请求呈现，不能拆分。

但是我想优化它。我知道Jquery解析脚本和其他东西的html。当表被替换时，它会清除分配给元素的事件。

有什么方法可以避免这种情况吗？就我而言，这不是必要的。我知道我的html没有任何脚本，也没有为它分配任何新星。我应该返回JSON并将其传递给本机"innerhtml"方法吗？或者你有什么更好的主意吗？

我发现$('#id').replaceWith(data)比$('#id').html(data)更好/更快。

这是因为$('#id').html(data)在替换之前需要时间来跟踪对象。当您命令简单替换时，它似乎会忽略任何现有值并完成直接交换。我在尝试交换具有数千个或选项的选择列表并使用 ajax 响应对其进行过滤时发现了这一点。 在观看代码时，我从字面上看它逐个删除了每个选择选项，然后逐个重新添加。

使用 .replaceWith(data) ，进行了拆分/快速/1 对 1 替换。

$('#HeaderIndholdPanel').replaceWith($data.find('#GridView1'));
$('#SvarIndholdPanel').replaceWith($data.find('#Table1'));
相关文章：