文章/答案/技术大牛

发布

社区首页 >问答首页 >在下载js和css时显示加载信息

问在下载js和css时显示加载信息
EN

Stack Overflow用户

提问于 2008-11-19 12:07:45

回答 4查看 204关注 0票数 1

我有一个web应用程序，这是大量加载的javascript和css。用户第一次登录时，一旦下载了js等文件，就需要一些时间来加载，然后缓存会让一切变得更快。

我希望我的用户知道这个加载时间。如何在下载js和css时添加一些代码来“显示”一些加载信息？

javascript

回答 4

Stack Overflow用户

回答已采纳

发布于 2008-11-19 12:23:35

您可以显示一个覆盖图，上面写着“正在加载...”并在下载完成时将其隐藏起来。

<html>
    <head>
        ... a bunch of CSS and JS files ...

        <script type="text/javascript" src="clear-load.js"></script>
    </head>
    <body>
        <div 
            style="position: absolute; left: 50px; right: 50px; top: 50px; bottom: 50px; border: 3px solid black;"
            id="loading-div"
        >
            This page is loading! Be patient!
        </div>

        ... Your body content ...
    </body>
</html>

clear-load.js的内容：

document.getElementById('loading-div').style.display = 'none';

当然，您也可以在加载的最后一个javascript文件的底部添加隐藏div的javascript代码。

另外，尝试将javascript和css文件打包到一个文件中，并对它们应用gzip压缩或"minify“。如果你做得对，你可以在20个请求中带来500KB的javascript，而不超过100KB的一个请求。

票数 3

Stack Overflow用户

发布于 2008-11-19 12:19:10

仁慈的母亲，Ricardo，这个应用程序涉及多少Javascript和CSS？

我想，您可以使用AJAX请求加载JS和CSS，而不对它们做任何事情。这会将JS和CSS文件加载到缓存中。您可以在“加载”页面上执行所有这些操作，并在加载文件后重定向到真正的页面。但是我想你真的不应该这么做。使用Fiddler来真正了解幕后发生的事情--确保人们在进行这种优化之前确实必须等待他们的JS/CSS文件下来。

票数 0

Stack Overflow用户

发布于 2008-11-19 12:22:42

加载时间取决于javascript和css的大小，这对我来说似乎很奇怪。您确定没有其他因素导致加载时间过长吗？

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/301696

复制

相似问题

问在下载js和css时显示加载信息
EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在下载js和css时显示加载信息EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在下载js和css时显示加载信息
EN