javascript - 加载 HTML 页面而不等待某些部分加载

Question

我有一个简单的 HTML 页面，其中包含许多部分，其中一个部分

<div id="external_data">...</div>

从外部源呈现数据并加载。加载需要很长时间，因此页面的所有其他部分也要等到加载此部分。

有没有办法使用 jQuery 或其他方法将内容设置<div id="external_data">为 aloading image并加载页面的其余部分而不依赖于该部分？以及如何实现这一目标？

Answer 1

如果该 div 的内容在服务器端呈现并与页面的其余部分一起提供，那么您可以选择两个选项：

1）使用包含您提到的加载图形的 div 为页面提供服务，然后在页面加载时使用 jQuery 以 $.post 或 $.get 加载 div 的内容。这将允许在没有任何后端逻辑的情况下提供页面，而您拥有的所有其他内容都是如此。

2) 如果您不喜欢使用 $.post 或 $.get，您可以在该 div 中放置一个 iFrame，该 iFrame 引用另一个具有该 div 内容的页面。这将与页面分开加载，因此不会阻止。但是，请注意 iFrame 在大小、边框等方面有时会在浏览器之间表现异常。请确保您的代码在所有主要浏览器（主要是 IE）中都经过测试，以确保在所有浏览器中看起来都正常。