HTML_html自动播放音乐

最新推荐文章于 2024-08-28 07:33:35 发布

阿舒带你学编程

最新推荐文章于 2024-08-28 07:33:35 发布

阅读量6.8k

点赞数 1

分类专栏：前端 html 面试文章标签： html javascript css3

本文链接：https://blog.csdn.net/m0_55613022/article/details/123149373

版权

本文介绍了如何使用HTML5结合JavaScript和CSS3实现网页中音乐的自动播放、控制播放及暂停功能，提供了一个完整的实例。

摘要由CSDN通过智能技术生成

自动播放

<audio  autoplay="autoplay" loop  id="music">
	<source src="http://music.163.com/song/media/outer/url?id=1308256434" audio="" >
</audio>

点击播放

<audio  autoplay loop  id="music">
	<source src="http://music.163.com/song/media/outer/url?id=1308256434" audio="" >
</audio>
function onmusic(){
	document.getElementById('music').play();		//播放
}

判断播放暂停

<div id="btn">播放暂停</div>


var audio = document.getElementById("music");
var btn = document.getElementById("btn");
btn.onclick = function () {         //点击按钮播放停止
    if (audio.paused) { //判断当前的状态是否为暂停，若是则点击播放，否则暂停
        audio.play();
    }else{
        audio.pause();
    }
};

完整实例