携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第1天，点击查看活动详情 >>

一、 audio 音乐标签

<audio src="音乐地址">浏览器不支持播放音乐时的显示文本<audio>

Audio 属性：

属性

值

描述

autoplay

页面加载完成后自动播放音乐。

controls

显示音乐控制组件。

loop

循环播放音乐。

muted

设置为静音播放。

preload

表明音乐标签跟随页面的加载一起加载，并在加载后等待随时播放。（如果有了 autoplay 属性，则该属性会被忽略）

src

URL

要播放的音频的 URL。

**Tips：**以上属性除了 src 都可以简写为一个单词。

Audio 对象方法：

方法

描述

addTextTrack()

更改播放的音频文件。

canPlayType()

检查浏览器是否支持播放目标 URL 音乐。

fastSeek()

播放的时候显示播放时间

getStartDate()

返回当前播放时间。

load()

重新播放。

play()

开始播放音乐。

pause()

暂停音乐。

简写：

<audio src="音乐地址" atuoplay controls loop muted preload="auto">默认文本<audio>

二、 video 视频标签

<video src="视频地址">浏览器不支持播放视频时显示的文本<video>

Video 属性：

属性

值

描述

页面加载完成后自动播放视频。

显示视频播放器。

设置视频播放器的宽度。

设置视频播放器的高度。

循环播放视频。

静音播放视频。

URL

下载视频时的显示图片，页是视频封面。

preload

随着页面加载的同时加载视频，并等待播放。（如果有了 autoplay 属性，则该属性会被忽略）

src

URL

播放视频路径，可以是相对路径，也可以是绝对路径。

**Tips：**以上属性除了 src poster width height 都可以简写为一个单词

Video 对象方法：

方法

描述

addTextTrack()

更改播放的视频文件。

canPlayType()

检查当前浏览器是否支持视频播放。

load()

重播当前视频。

play()

开始播放视频。