用window.location.href做页面跳转，怎么在新页面加载完全之前实现loading效果？

Question

用window.location.href做页面跳转，怎么在新页面加载完全之前实现loading效果？

Answer 1

你这个有兼容性要求么？可以在跳转也加一个loading 层，用js 控制一下我写了个例子：https://www.mnzld.net/demo/lo...

Answer 2

location.href跳转是会导致页面完全刷新的，这已经和之前的页面无关。
页面是从上到下解析的，将loading放在上部，自然会被优先加载，但如果使用的是图片，图片的下载是异步进行，所以还是无法把控顺序，可能会一闪而过。
如果非要看到，可以使用非图片的loading，然后先把其他内容隐藏，只出现loading，等加载完全触发ready后再显示。

Answer 3

使用window.location.href去完成页面的跳转，这是瞬发的，所以在跳转页(A)做loading是不靠谱的。
那么loading效果是应该放到被跳转页(B)来做。但是img标签src属性是异步的，如果不是用js去控制的话，那么这时你也无法保证img加载的时间，这个时候可以试着用直接写进模板文件当中的css的loading效果来做，等页面加载完了之后关掉css的loading效果。

Answer 4

如果是我的话，我会这样做：
1、可以在window.location.href跳转的页面里面本身加loading效果。
2、如果没变法修改window.location.href跳转页面的内容，我会用ajax请求页面，将html插入到当前页面，在请求页面的时间loading。