HTML DOM Audio 对象
HTML DOM Audio 对象
HTML DOM Audio 对象是JavaScript中预定义的一个内置对象,用于操作音频文件。音频文件可以是音乐、音效、音频对话框等等,可以在网页中直接播放。
创建HTML DOM Audio对象
HTML DOM Audio对象可以通过调用Audio构造函数来创建。
语法:
var myAudio = new Audio('audiofile.mp3');
使用这个方法创建一个新的Audio对象,赋值给变量myAudio。可以指定音频文件的URL,这里的URL可以是本地文件或者互联网上的网址。
在创建Audio对象后,常用的属性是autoplay,controls,currentTime,loop,muted和volume。
播放音频
要播放音频,可以调用Audio对象的play()方法。这将开始播放音频文件。
var myAudio = new Audio('audiofile.mp3');
myAudio.play();
停止音频
要停止播放音频,可以调用Audio对象的pause()方法。这会立即停止播放音频文件。
var myAudio = new Audio('audiofile.mp3');
myAudio.pause();
音频控制
常用的音频控制包括音量和当前播放进度。
音量控制
使用volume属性来控制音量,该属性的取值范围为0.0到1.0,0.0表示无声,1.0表示最大音量。可以在代码中设置此属性的值来更改音量:
var myAudio = new Audio('audiofile.mp3');
myAudio.volume = 0.5;
当前播放进度控制
使用currentTime属性来更改当前播放进度,这个属性指定音频文件中的当前位置(以秒为单位)。可以使用以下代码控制当前播放进度:
var myAudio = new Audio('audiofile.mp3');
myAudio.currentTime = 30;
自动播放
要使音频文件自动播放,可以将autoplay属性设置为true。
var myAudio = new Audio('audiofile.mp3');
myAudio.autoplay = true;
循环播放
要使音频文件循环播放,可以将loop属性设置为true。
var myAudio = new Audio('audiofile.mp3');
myAudio.loop = true;
控件
要使音频文件显示控件,可以将controls属性设置为true。
var myAudio = new Audio('audiofile.mp3');
myAudio.controls = true;
加载事件
当音频文件加载完成时,会触发load事件。
var myAudio = new Audio('audiofile.mp3');
myAudio.addEventListener('load', function() {
alert('Audio file is loaded!');
});
结束事件
当音频文件播放结束时,会触发ended事件。
var myAudio = new Audio('audiofile.mp3');
myAudio.addEventListener('ended', function() {
alert('Audio file is finished playing!');
});