播放音频:
var audioDom = document.querySelector('audio');
document.querySelector('input').onclick = function() {
console.log(audioDom.paused); //true
audioDom.play();
console.log(audioDome.paused); //false
}
audioDom.paused返回的结果是布尔值
因此,点击按钮来停止或开始音频的代码如下:
var audioDom = document.querySelector('audio');
document.querySelector('input').onclick = function() {
if(audioDom.paused == true) {
audioDom.play();
$(this).css('background-image','url(image/pause.png)'); //播放状态下显示播放的图片
} else {
audioDom.paused();
$(this).css('background-image','url(image/play.png)'); //暂停状态下显示暂停的图片
}
}
给按钮设置背景图片,是在按钮里面加个图像的样子,不太好看,就需要把按钮的边框去掉,只需设置border:none;outline:none;即可
play()和paused()方法都是Dom的语法
插件执行的某个时机,干某件事,优先去找回调函数