HTML5 使用audio元素

提問人：劉團(tuán)圓發(fā)布時間：2020-11-16

作為多媒體元素，audio元素用來向頁面中插入音頻或其他音頻流。

【例題】添加音頻

代碼如下:

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

</head>

<body>

</body>

</html>

上面代碼中的audio元素總共做了這幾件事：先是規(guī)定了在頁面中插入一個音頻文件，再指定了音頻的路徑，最后讓這個音頻文件有一個可以供用戶使用的播放和暫停音頻的按鈕。代碼運(yùn)行效果如圖所示。

從圖中可以看出，有一個可以控制播放和暫停的按鈕、一個可以拖拽進(jìn)度的進(jìn)度條、一個以進(jìn)度條顯示的調(diào)節(jié)音量的控件。這么少的代碼就已經(jīng)完成了這么多的操作！

當(dāng)然，如果audio元素只有上面那三個功能的話，還遠(yuǎn)遠(yuǎn)不能滿足用戶的需要。下面列出了audio元素的一些其他屬性與功能。

(1)自動播放，如果需要網(wǎng)頁中的音頻自動播放，可以使用autoplay屬性，代碼如下：

〈audio src="Sleep Away.mp3" autoplay></audio>

(2)按鈕播放，如果需要網(wǎng)頁中的音頻有控制播放的按鈕，可以使用controls屬性，代碼如下：

(3)循環(huán)播放，如果需要網(wǎng)頁中的音頻循環(huán)播放，可以使用loop屬性，代碼如下：

<audio sre="Sleep Away.mp3" autoplay loop〉</audio〉

(4)靜音，如果需要網(wǎng)頁中的音頻靜音，可以使用muted屬性，代碼如下：

(5)預(yù)加載，如果需要網(wǎng)頁中的音頻預(yù)加載，可以使用preload屬性，代碼如下：

相關(guān)視頻回答

回復(fù)(0)