浅析JS异步加载进度条_javascript技巧

1) 当点击Load的时候,模拟执行异步加载. 浏览器被遮挡. 进度条出现.

实现思路:

1.当用户点击load button执行异步请求. 调用方法 出现加载条

2.怎么实现进度条呢？

1) 在document.body 新增一个div.覆盖浏览器. 设置背景会灰色. z-index = 999. 加载的时候让用户无法修改界面值

2) 在document.body 新增一个动态的div.

代码实现:

Main.html:

　 Loading.js:

　　Loading.css

　总结:

1.可以将方法提出来. 对Ajax请求重新封装一次. 实现调用Ajax请求的时候自动条用进度条方法.

2.如果是Angular的话. Angular提供了方法监控http调用.监控http执行请求的时候调用进度条方法就行了.无需在每次执行 http调用.监控http执行请求的时候调用进度条方法就行了.无需在每次执行http的时候都去自己调用出现进度条的方法.

以上内容是小编给大家介绍的js异步加载进度条的相关内容，希望对大家有所帮助！