HTML5的音频元素是一个非常强大的元素并且可以避免过多依赖第三方插件。例如QuickTime，Flash。最新的浏览器，比如Chrome10+和Firefox3.6+都已经嵌入了JavaScript库，并且还提供了方法和属性来操纵<audio>元素。在这篇文章中，我们将探讨几种最重要的方法并探讨如何使用JavaScript来运行audio文件。
摘要：尽管这篇文章主要介绍Audio对象，但是这些方法和属性也同样适用于Video对象。
Audio Methods
.load()；
---Loads and re-loads the audio element for playback。（加载或者重加载audio元素实现重播）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.load(); </p></li></ol>
|
.play()；
---Starts playing the audio file。（开始播放音频文件）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.play(); </p></li></ol>
|
.pause()；
---Pauses playback of the audio file。（暂停播放音频文件）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.pause(); </p></li></ol>
|
.canPlayType(type)；
---Checks with browser to see if type of audio file is supported。（检查浏览器是否支持音频文件）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.canPlayType('audio/ogg; codecs="vorbis"'); </p></li></ol>
|
Audio Properties
.currentTime
---Sets or returns the playback position in the audio file， Value is in seconds。（设置或返回音频文件开始播放的位置，返回值以“秒”为单位）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.currentTime = seconds; </p></li></ol>
|
.duration
---Returns the length of the audio file in seconds。（返回播放音频在某秒上的播放的长度）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>var seconds = audioElement.duration; </p></li></ol>
|
.src
---The url where the audio file exists。（音频文件的url）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.src = 'audio.ogg'; </p></li></ol>
|
.volume
---Sets or returns the volume of the audio file。（设置或返回音频文件的体积）
双击代码全选
|
1
|
<ol class="dp-xml" style="border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:solid;list-style-position:initial;list-style-image:initial;background-image:initial;background-attachment:initial;background-origin:initial;background-clip:initial;color:#5c5c5c;border-left-width:3px;border-left-color:#146b00;font-size:14px;padding:5px 0px;margin:0px 0px 1em 20px;"><li><p>audioElement.volume = value; </p></li></ol>
|
注意：以上并没有把音频的所有方法和属性列出来，只介绍了常用的几个方法和属性。
发表回复