HTML5 audio 标签-在html中定义声音的标签
2019獨(dú)角獸企業(yè)重金招聘Python工程師標(biāo)準(zhǔn)>>>
本文來(lái)源 169it
HTML 5 <audio> 標(biāo)簽定義和用法
? <audio> 標(biāo)簽定義聲音，比如音樂或其他音頻流。
? HTML5 <audio> 元素使 Web 開發(fā)人員可以將聲音嵌入他們的應(yīng)用程序。控制的靈活性加上平臺(tái)其他功能的集成，使多個(gè)應(yīng)用場(chǎng)景得以實(shí)現(xiàn)，包括從簡(jiǎn)單的聲音效果到背景音頻，再到游戲體驗(yàn)以及更復(fù)雜的音頻引擎。
?? HTML 4.01 與 HTML 5 之間的差異
?? <audio> 標(biāo)簽是 HTML 5 的新標(biāo)簽。
HTML 5 <audio> 標(biāo)簽屬性
屬性???????? 值???????? 描述
autoplay true | false 如果是 true，則音頻在就緒后馬上播放。
controls true | false 如果是 true，則向用戶顯示控件，比如播放按鈕。
end numeric value 定義播放器在音頻流中的何處停止播放。默認(rèn)地，聲音會(huì)播放到結(jié)尾。
loopend numeric value 定義在音頻流中循環(huán)播放停止的位置，默認(rèn)是 end 屬性的值。
loopstart numeric value 定義在音頻流中循環(huán)播放的開始位置。默認(rèn)是 start 屬性的值。
playcount numeric value 定義音頻片斷播放多少次。默認(rèn)是 1。
src url 所播放音頻的 url。
start numeric value 定義播放器在音頻流中開始播放的位置。默認(rèn)地，聲音在開頭進(jìn)行播放。
HTML 5 <audio> 標(biāo)簽標(biāo)準(zhǔn)屬性
class, contenteditable, contextmenu, dir, draggable, id, irrelevant,
lang, ref, registrationmark, tabindex, template, title如需完整的描述，請(qǐng)?jiān)L HTML 5 中標(biāo)準(zhǔn)屬性。
HTML 5 <audio> 標(biāo)簽事件屬性
onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu,
ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover,
ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup,
onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout,
onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload
HTML 5 <audio> 標(biāo)簽--在播放之前預(yù)加載音頻
?? 只要您準(zhǔn)備好了音頻元素，您就可以選擇最佳預(yù)加載策略。HTML5 <audio> 規(guī)范用三個(gè)可能的值描述預(yù)加載屬性：
? “none”：提示用戶代理，作者不希望用戶需要媒體資源，或者是，服務(wù)器要盡量減少不必要的流量。如果您的應(yīng)用場(chǎng)景是每個(gè)帖子都帶有音頻文件的一個(gè)播客，這就是一個(gè)非常合適的選項(xiàng)，因?yàn)樗鼫p少了初始預(yù)加載的帶寬。只要用戶播放文件（無(wú)論是通過(guò)默認(rèn)可視控件還是 JavaScript 方法 load() 或 play()），瀏覽器將開始提取音頻流。
? “metadata”：提示用戶代理，作者不希望用戶需要媒體資源，但提取資源元數(shù)據(jù)（維度、持續(xù)時(shí)間等）是合理的。如果您在構(gòu)建音頻播放器控件，并且您需要關(guān)于音頻剪輯的基本信息，但尚不需要播放它，推薦該選項(xiàng)。
? “auto”：提示用戶代理，用戶代理可以在對(duì)服務(wù)器不構(gòu)成風(fēng)險(xiǎn)的情況下把用戶的需求放在首位，直至并包括樂觀地下載全部資源。
如果您正在構(gòu)建一個(gè)游戲，這可能是最合適的方式，因?yàn)樗鼓梢栽谡嬲_始游戲體驗(yàn)之前預(yù)加載全部音頻剪輯。
請(qǐng)注意，當(dāng)您以編程方式設(shè)置音頻元素的 src 屬性時(shí)，瀏覽器將設(shè)置preload（預(yù)加載）屬性，除非它已被設(shè)置為 “auto”。基于此原因，如果您的應(yīng)用場(chǎng)景需要一個(gè)不同的值，請(qǐng)務(wù)必在設(shè)置 src 之前在代碼行中指定它。
?? 請(qǐng)注意，當(dāng)您以編程方式設(shè)置音頻元素的 src 屬性時(shí)，瀏覽器將設(shè)置preload（預(yù)加載）屬性，除非它已被設(shè)置為 “auto”。基于此原因，如果您的應(yīng)用場(chǎng)景需要一個(gè)不同的值，請(qǐng)務(wù)必在設(shè)置 src 之前在代碼行中指定它.
HTML 5 <audio> 標(biāo)簽例子1：
1
<audio src="someaudio.wav">您的瀏覽器不支持 audio 標(biāo)簽。</audio>
HTML 5 <audio> 標(biāo)簽例子2：
<audio id="media" src="http://www.169it.com/test.mp3" controls></audio>
HTML 5 <audio> 標(biāo)簽例子3：
<audio src="audio/sample.mp3" autoplay>
</audio>
var audio = document.createElement("audio");
if (audio != null && audio.canPlayType && audio.canPlayType("audio/mpeg"))
{
audio.src = "audio/sample.mp3";
audio.play();
}
HTML 5 <audio> 標(biāo)簽例子4:
<body>
<audio src="audio/Bass.mp3" autoplay loop>
</audio>
<audio src="audio/Drum.mp3" autoplay loop>
</audio>
<audio src="audio/Crunch.mp3" autoplay loop>
</audio>
<audio src="audio/Guitar.mp3" autoplay loop>
</audio>
<audio src="audio/Pizzicato.mp3" autoplay loop>
</audio>
</body>
本文來(lái)源? HTML5 <audio> 標(biāo)簽-在html中定義聲音的標(biāo)簽
轉(zhuǎn)載于:https://my.oschina.net/u/1766067/blog/287108
總結(jié)
以上是生活随笔為你收集整理的HTML5 audio 标签-在html中定义声音的标签的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 【Spring reference】@R
- 下一篇： HTML学习笔记2—列表与清单