至此,我们便可以在页面中使用懒加载来优化用户体验了。
lazyLoad.html
思路的问题。一般我们只依靠onload或者document.ready事件来判断页面是否加载完毕,因为loading状态没有意义。因为页面完全加载之前,我们无法了解哪些东西已经加载了,如果这个时候调用js或者html元素可能产生错误。
页面加载之前是没有任何事件的。所谓加载之前的动画是形如以下的代码
<html>
<body
onload="第一个div隐藏,第二个div显示">
<div>
<img
src='loading.gif'
style="width:
100%"
/>
</div>
<div
style="diaplay:
none">
<!--页面内容在这里加载-->
</div>
</body>
</html>