加载初始网站后在后台加载数据

Question

我有一个包含帖子和评论的供稿。

我只显示最后 5 条评论，其他 css-隐藏，点击 "Show all comments" 时显示。

目前我的想法是在单击 "Show" link 时获取这些评论 (ajax)。

有没有办法在初始页面加载后立即在后台自动加载这些评论？

更新

<div class='container'>
    <div class='post'>This is a post</div>
    <div class='comment hidden'>This is a comment</div> # To load asynchronously
    <div class='comment hidden'>This is a comment</div> # To load asynchronously
    <div class='comment hidden'>This is a comment</div> # To load asynchronously
    <div class='comment hidden'>This is a comment</div> # To load asynchronously
    <a href='#'>Show all comments</a>
    <div class='comment'>This is a comment</div>
    <div class='comment'>This is a comment</div>
    <div class='comment'>This is a comment</div>
    <div class='comment'>This is a comment</div>
    <div class='comment'>This is a comment</div>
</div>

Answer 1

<body onload="script();">

或

document.onload = function ...

或

window.onload = function ...

Answer 2

我可能会考虑等到用户执行给定的操作（例如单击 "Show" link 之后再加载其他评论（或至少其中的大部分评论）。这可以防止您的页面加载（即使在后台）用户永远 requests/needs 看不到的大量评论。如果您的任何用户使用移动设备，这也有助于减少应用程序的数据负载。

就实施而言，您可以选择 JS/Ajax 工具（vanilla、jquery、angular、vuejs、react 等）并设置一个附加的点击事件X 更多评论到您的初始列表。

希望对您有所帮助！

Answer 3

我认为流 table 是最好的方法。

StreamTable.js 背后的想法是最初填充最少的行（可能是 10 或 20），然后它在后台静默地传输数据并更新 table。这可确保页面立即加载，并且可立即用于所有操作。可以安全地假设，如果用户在同一页面上停留的时间更长，那么用户很可能会在 table 上执行一些操作，例如搜索、页面导航等。因此我们可以延迟页面加载后 2 秒的流数据处理过程。确保所有流式传输的数据必须立即可用也很重要。例如，2 秒后，如果我们流式传输了 1000 行，它们都应该是可搜索和分页的。

有关更多详细信息，请查看此 link
这是最好的 js 库之一。

加载初始网站后在后台加载数据

Load data in background once initial website is loaded

javascript

jquery

asynchronous

ruby-on-rails

ruby-on-rails-5