加载XHR数据时可以更新DOM吗？

Question

我正在使用Slick JS创建滑块，并使用AJAX和slickAdd方法向其中添加幻灯片，如下所示：

$.getJSON(url, function(r) {
  $.each(r, function(i, article) {
    var html = 'HTML string created with data and ' + article.variables +  ' from JSON';
    $('.element').slick('slickAdd', html);
  }
}

此AJAX起作用，并且在浏览器具有所有XHR数据之后，幻灯片已成功添加到滑块。

这是一个Slick JS滑块的事实仅仅是上下文。我相信这个问题比这更笼统。

主要问题：我是否可以在AJAX仍在加载XHR数据时强制each循环输出'html'，从而为用户提供性能更高的体验幻灯片尽快添加到DOM的网站？如果是，怎么办？

当功能在“每个”循环时，我可以看到返回的每个项目的离散XHR数据，并且理想情况下，我希望在所有迭代完成之前开始添加到DOM（有延迟）。

该站点主要是PHP，因此，如果在前端的JS / jQuery中没有真正的“干净”方式来处理此问题，则可以使用PHP ob_flush在服务器端进行操作，但是想首先向一些JS大师（提出意见）提出建议/批评。

我不必一定要有完整的代码示例，而只是一个高级解释-我对JS有点不了解。

非常感谢； P

Answer 1

TL：DR;没有一个请求。

如果您要使用基础的XMLHttpRequest对象执行AJAX请求，则可以在数据从服务器返回时获得更新，并有可能在加载数据时执行更新。

>

但是，这样做的一个明显问题是，JSON必须等到完全加载后才有效。尽管您可以手动解析它，但这样做并不值得。

执行所需操作的唯一解决方法是为每个数据块发送单独的请求并分别处理它们。