亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

HTML5 Audio(音頻)

HTML5的audio功能上已經(jīng)非常強(qiáng)大，回放，跳轉(zhuǎn)，緩沖等以前只能用flash才能實(shí)現(xiàn)的功能，html5的audio都能輕松搞定。

但是直到現(xiàn)在，仍然不存在一項(xiàng)旨在網(wǎng)頁(yè)上播放音頻的標(biāo)準(zhǔn)。


audio的語法以及屬性和方法

使用語法
<audio src="song.mp3" controls="controls" loop="loop" autoplay="autoplay">親 您的瀏覽器不支持html5的audio標(biāo)簽</audio>
屬性
src  是歌曲的路徑
controls  播放控制 如果給標(biāo)簽里寫了 controls="controls" 那么網(wǎng)頁(yè)會(huì)顯示audio自帶的播放控件，如果沒寫就不會(huì)顯示.
loop 歌曲循環(huán) 在標(biāo)簽里添加該屬性歌曲循環(huán) 如果你的歌曲是從后臺(tái)調(diào)取的的 也可以在ajax里設(shè)置 loop=true/false來控制;
autoplay 當(dāng)歌曲加載后自動(dòng)播放，但是只有pc端可以實(shí)現(xiàn) 移動(dòng)端不行(pc端的瀏覽器要比移動(dòng)端的完善很多，對(duì)有些屬性支持也會(huì)好很多)
以上是標(biāo)簽內(nèi)的屬性 當(dāng)然也可以作為對(duì)象屬性來調(diào)取控制auido.*

audio不單單是個(gè)標(biāo)簽 他也是window下的一個(gè)對(duì)象，對(duì)象就有屬性和方法，作為對(duì)象他有哪些常用的方法呢

對(duì)象屬性：
currentTime 獲取當(dāng)前播放時(shí)間
duration 獲取歌曲的總時(shí)間
play 是否在播放 返回true/false
pause 是否暫停 返回true/false
對(duì)象方法：
play() 播放歌曲
pause() 暫停歌曲
load()重新加載歌曲

HTML5中三種基本格式：

1.最少的代碼

<audio src="song.ogg" controls="controls"></audio>

2.帶有不兼容提醒的代碼

<audio src="song.ogg" controls="controls">
Your browser does not support the audio tag.
</audio>

3.盡量兼容瀏覽器的寫法

<audio controls="controls">
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

<!doctype html>
<html>
    <head> 
    <meta charset="utf-8"> 
    <title>php.cn</title> 
    </head>
    <body>
        <audio controls>
           <source src="horse.ogg" type="audio/ogg">
           <source src="horse.mp3" type="audio/mpeg">
             您的瀏覽器不支持 audio 元素。
        </audio>
    </body>
</html>


Weiter lernen
||
<!Doctype html> <html> <head> <title>HTML5多媒體</title> <meta charset="utf-8"/> <script> function onInputFileChange() { var file = document.getElementById('file').files[0]; var url = URL.createObjectURL(file); console.log(url); document.getElementById("audio_id").src = url; } </script> </head> <body> <input type="file" id="file" onchange="onInputFileChange()"> <audio id="audio_id" controls autoplay loop>Your browser can't support HTML5 Audio</audio> </body> </html>
einreichenCode zurücksetzen