微信浏览器播放音频的问题：preload属性

测试工具：ios微信。

h5的Audio对象有个很重要的属性：preload;preload 属性规定是否在页面加载后载入音频。有4个值：
auto - 当页面加载后载入整个音频
meta - 当页面加载后只载入元数据
none - 当页面加载后不载入音频
空字符串 - 等效于auto属性

对于Audio对象，如果不需要展示播放界面，我们完全可以在js里构造这个对象：

var audio = new Audio;
audio.preload = 'none';//设置none属性
//当点击第一个div元素是播放音频
document.getElementsByTagName('div'）[0].addEventListener('click', function () {
	audio.play()
},false)

　　

如果是考虑到初次加载页面显示快慢的问题，我们完全可以将preload设置为'none',这样就不会在页面首次加载的时候下载音频资源。
以上做法在safari（手机浏览器）和chrome（电脑浏览器）里，没有任何问题，打开chrome的network,发现页面初始化确实不会加载音频，只有当点击的时候，调用auido的play()方法时，才会下载音频。但是，事情并没有那么顺利，我们在ios的微信里，发现根本不播放音频。解决办法：
1.不设置preload值或者设置preload为auto，微信浏览器都可以播放，但是页面音频比较多，第一次都会加载，网页速度慢。
2.在设置audio.preload = 'none'，不提前加载的情况下：用微信内置的方法：

if(typeof WeixinJSBridge === 'object'){
	 WeixinJSBridge.invoke('getNetworkType', {}, function(e) {
        audio.play();
     });
}else{
	audio.play()
}

　

注意，网上有很多资料说要用：document.addEventListener("WeixinJSBridgeReady"）。我测试的都不会触发这个事件！！！