轻键快码

网页加载提示的实现

轻键快码 网页加载

先上 示例.

网页加载慢的原因有很多,如果页面上有很多的大图片多数情况下网页的加载速度会很慢, 如果没有一些提示,那么用户很可能会认为网站出问题了,进而取消访问。所以我们可以利用页面加载状态 API 来改进页面体验。 主要是利用 readystatechange事件 以及 document.readyState 来实现。

document.readyStateloading, interactive, complete 这几个状态, 我们只要利用好 complete 这个状态来实现逻辑。在页面没有完全加载的时候就在页面上显示一个加载提示,当页面上图片加载完整后再把加载提示移除就可以了。

if (document.readyState === "complete") {
    // clear loading
}

github