HTML5音频

HTML5音频播放详解

最新推荐文章于 2024-04-23 08:22:56 发布

原创最新推荐文章于 2024-04-23 08:22:56 发布 · 511 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html5 #多媒体 #音频

HTML5 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了HTML5中用于播放音频的Audio元素，包括其控制器属性，以及如何通过控制台操作音频播放、暂停和调整音量。同时，文章通过实例展示了如何在网页中插入并播放音频文件。

知识点
1.Audio（音频）
HTml5提供了播放音频文件的标准
2.Control（控制器）
Control属性供添加，暂停和音量控件
3.标签
定义声音
规定多媒体资源，可以是多个

实例1
简单音频播放

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>播放音频</title>
</head>
<body>
    <audio src="raw/2.mp3" controls="controls">你的浏览器不支持！！！！</audio>
</body>
</html>

实例2

自定义控制器
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>播放音频</title>
</head>
<body>
    <button onclick="clickV()">播放/暂停</button>

    <audio src="raw/2.mp3" id="audio">你的浏览器不支持！！！！</audio>

    <script>
        var v=document.getElementById("audio");
        function clickV(){
            if(v.paused){
                v.play();
            }else{
                v.pause();
            }
        }
    </script>
</body>
</html>