Html：使用Javascript可以使用静态html进行无限（有限？）滚动吗？

Question

我在S3中自动生成并保存了静态html文件。有时文件大小达到2mb。是否可以使用javascript来获取html文件的一部分，显示它，当用户到达页面底部时，获取下一部分等等？

Answer 1

XHR Object提供了一种设置自定义HTTP标头的方法。因此，您可以尝试设置Range header，以便只获取静态文件的一部分。

你必须考虑到不是正确HTML的块，因为你正在剪切文件的任意一片，所以如果你打算显示它们，你必须实现逻辑来正确处理结果。

我很乐意看到你以这种方式实现它，而不是像往常一样利用分块到服务器。

Answer 2

问题不在于如何进行无限滚动，我真的如何一次加载大文件的一部分，在用户向下滚动时加载更多文件。我不确定这是否可能，所以这是另一个解决方案：

将较大的文件存储在较小的块中，让我们说1.txt, 2.txt ...然后，在页面上，当您向下滚动时，您可以加载下一个N.txt。 （顺便说一句，不一定是txt）。只需确保您的包装器（用户实际看到的文件）具有完整的HTML，并且它加载的块只是内容。这意味着块不应该像包装文件中的</body></html> ...那样。

此处为how to fetch a file using AJAX或使用jQuery。你真正需要做的就是跟踪你所在的部分，以便加载下一部分。如果它不存在，那么你已经加载了整个文件。

Answer 3

这是完全可能的 - 这个想法是你可以在服务器上预渲染“片段”，其中每个片段代表N篇文章的“子页面”或者你有什么。然后，您使用0（或1）个片段呈现页面，并将其发送到客户端。当客户端滚动到底部时，您只需要请求下一个片段（使用AJAX）并将其附加到上一个片段的末尾。继续无限期地这样做。

要理解的关键点是每个片段都是在服务器上静态呈现的。虽然片段本身可能不是一个完整的HTML页面，但它们可以“无限地附加”到现有页面中。 HTTP（而不是完整的HTML）的部分乐趣在于，您无需拥有完整的HTML页面即可成功提供任何片段;您可以将HTML视为“样板”，它围绕着任意一块额外的，格式不正确的HTML（当放置在样板文件中时会变得格式良好）。

由于AJAX基于HTTP请求，因此您可以要求任意内容。哎呀，你可以要求自己的自定义标记，只要“捕获”响应的Javascript可以按照浏览器可以理解的方式格式化它 - 即HTML，CSS和JavaScript。