我想在页面里引入一个audio标签，资源文件放在服务器上，如何监测到下载的进度呢，不仅仅是知道什么时候下载完成能播放了，而是下载的一个进度，有相关的事件吗？
巴扎黑2017-04-10 13:12:28
监测具体的进度，可以绑定progress事件或自己启动一个定时器，并用buffered和duration计算出来，注意buffered是一个timeRanges对象，详情请参考：http://www.w3school.com.cn/html5/av_prop_buffered.asp。
progress事件和buffered在安卓上面的webkit系列支持性很差，这是我前年到去年做audio相关的 Web App 时的实测结果。不知道现在怎样了，缺乏测试机，也没有找到大规模的靠谱测试……
至于什么时候可以播放了，这个问题反而比上面的要棘手。
audio有相应事件可以辅助判断音频是否可以播放，但各个浏览器对下面的事件支持不完全/不完整，如果对兼容性敏感的话，不建议使用。
| 事件 | 描述 |
| progress | 当浏览器正在下载音频/视频时 |
| canplay | 当浏览器可以播放音频/视频时 |
| canplaythrough | 当浏览器可在不因缓冲而停顿的情况下进行播放时 |
判断音频能否播放，现在最成熟的方案还是在音频调用loadAPI以后，开启一个定时器判断<audio>的相应readystate属性是否大于了1。“用定时器监测代替事件”依然是解决兼容性问题的万金油。
为何一定要做这个判断呢，因为audio标签的play的api的实现有差异。现在的浏览器分成两个阵营，play各有各的逻辑：
所以会有调用了audio.play但是什么也没有发生的情况……因此一定要在时序上保证：
audio.load()audio.readystate>1的时候audio.play()参考：w3school HTML 5 视频/音频参考手册
下表为readystate的对应值的代表。
| 0 | HAVE_NOTHING | 没有关于音频/视频是否就绪的信息 |
| 1 | HAVE_METADATA | 关于音频/视频就绪的元数据 |
| 2 | HAVE_CURRENT_DATA | 关于当前播放位置的数据是可用的，但没有足够的数据来播放下一帧/毫秒 |
| 3 | HAVE_FUTURE_DATA | 当前及至少下一帧的数据是可用的 |
| 4 | HAVE_ENOUGH_DATA | 可用数据足以开始播放 |
感谢@怡红公子提醒，把跟问题前一个分句相关的答案调到后头……
黄舟2017-04-10 13:12:28
有个buffered属性不知道是不是你要找的，参考资料：