最新赞助活动温馨提示:自愿赞助服务器费用,学生和没有工作的整站资源免费下载!
头像

Pace.js的原理是怎么样的?-H5教程

来源:http://erdangjiade.com/topic/133484.html H5程序员 2017-10-27 12:55浏览(26)

PACE — Automatic page load progress bars

回复内容:

泻药
没用过
不过他有开源的
你可以看具体怎么实现的么
扫听一眼
基本上是几种中方案的混合

1、document.onreadystatechange
该事件读 document.readyState 字符串
{ loading: 0, interactive: 50, complete: 100 }
分别给出写死的进度值

2、如果支持 ProgressEvent 事件
监听 progress 事件 evt.loaded / evt.total 得出进度

3、onreadystatechange 事件
读取 readyState 字符串
{‘0’: 100, ‘3’:50, ‘4’:100}
分别给出写死的进度值

然后覆盖
window.XMLHttpRequest
window.XDomainRequest
window.WebSocket
方法
变为包装方法
内部调用原始方法
外层加入调用这些发方法时候监听进度
得到值进行动画等处理
评论0
头像

友情提示:垃圾评论一律封号 加我微信:826096331拉你进VIP群学习群

1 2