media网页设计与网站讲稿中医学院互联网应用技术

（）2345audioaudioaudio地推动了互联网应用的发展。今天通过优酷、土豆、乐视、CNTV、电视剧和综艺，成为人们使用互联网的主要应之一和音频的广泛应用，使得在网络中使用和音频技术变一、从网络上的说在HTML5规范之前，如果希望在网页上、音频，通畅都需要借助第插件，比如Flash。或者需要自主开发使用多不论是文件还是音频文件，例如.avi、.flv等，实质上都时，音频轨道和轨道是绑定在一起的。元数据部分包含了视频的封面、标题、子标题、字幕等信息。MPEG-FlashAudio音频和的编音频和的编码/器是一组算法，用来对一段特定音频或进行和编码，以便音频和能够。当一个的时候，器（器）需要完成的工有第一步：解析容器格式以找出可以使用 和音频轨道，并析它们的结构，以便接下来的工作第二步：对流，并在屏幕上显示一幅幅的图像。第三步：对音频流，同时给扬声器传输声音信号。编器包括有损和无损两种。无损文件一般太大了，在网页中没有优势，所以在网络上传送的采用的都是有损编器。有损编器中，信息在编码过程的丢失时无法避免的。这就好比从一个磁带音频，每次都会丢失一些原来音频的信息，复音频和的编码算法很多，常见的有音频编器有：AAC、MPEG-3、OggVorbis。编器有：H.264、VP8、OggTheora。有些编是受专利保护的，有些则是免费的。例如Vorbis、Theora免费的，可以随意使用H.264、MPEG-4需要支付专WebM由于2010年5月发布，是一个开放、免费的文件格式。现在主流的Web都比较模糊，作为新的音频和格式，WebM旨在改善这种现状，让Web清晰化。WebM的后缀名是.webm。WebM格式其实是以Matroska（MKV）容器格式为基础开发的新容器格有的VP8编码技术以类似BSD开源，OggVorbis本来就是开放格HTML5Audio和的限虽然HTML5增加了音频和的元素，但是有些功能目前仍然没有得到HTML5的支持。流式音频和。目前HTML5中没有比特率切换的标准，所以HTML5对的支持只限于加载的全部文件。HTML5自身无法在全屏时进行控制。这个功器具体的支持情况可以通过查询 图图9-1Chrome26、Firefox20、IE10对HTML5音频 二、和audio元在HTML4中，没有音频和的元素，只能够使用<object><!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN" 音频 插件，则就无法。在HTML5中，新增加了和audio两个元素。元素专门用来网络上的，audio元素用来网络上的音频。使的这两个元素并且能够支持音频、文件的编器即可。同时，<!doctype<!doctype<metacharset="utf-<title>HTML4 < 音频由于目前浏览器能够支持的编器不一致，为了确保一个能够同时被所有支持HTML5的浏览器支持，则可以通过<source>元素来为同一个指定多个源，供不同的浏览器来选择适合自己的。<!doctype<!doctype<metacharset="utf- 示例9-3：使用多个源，在HTML5音频 <audio三、和audio的属audio元素的属性大致相同。src属性用来指定数据的URL地址元素介绍该属性中指定或者音频是否进行预加载。如果使用预加载，因为在进行数据时，可能数据已经缓冲一部分或者缓冲完成。preload属性值有三种none字节数、第一帧、列表、持续时间等信息。auto：表示预加载全部或音频。该值是默认值展示一张替代，从而避免不可用时，页面出现一片空白。该属性中指定是否循环或音频元素介绍该属性中指定是否为或音频添加浏览器自带的用的控width元素介绍该属性为vedio元素的独有属性。用来指定的宽度和高度元素介绍在、使用数据的过程中，在正常情况下，和audio元素的error属性为null。当出现错误时，error属性将返回一个MediaError象，该对象通code的方式将错误状态提供出来。错误状态值为只读属性，且有4个可能值：时出现网络错误，数据的过程被中止。<!doctype<metacharset="utf-<!doctype<metacharset="utf- <>" error= {varerrorinfo= {case casecase case }9-错误状数据在加载过程中可以使用元素或audio元素的networkState属性当前网络状态，其可能值有4个，该属性值（1）0：NETWORK_EMPTY：初始状态放，但尚未建立网络连接。（3）2：NETWORK_LOADING：数据加载中（4）3：NETWORK_NO_SOURCE：没有支持的编码格式，不进行载元素介绍currentSrc属性用来元素和audio元素中正在中的数据的URL地址。元素介绍以确认浏览器是否已缓存数据。buffered属性值为只读属性元素介绍该属性返 或audio元素中当前位置的就绪状态置没有数据。（2）1：HAVE_METADATA：已经获得到足够的信息，但是前位置没有有效的数据，暂时不能够（3）2：HAVE_CURRENT_DATA：当前位置已经有数据可以播（43HAVE_FUTRE_ATA而且也获取到了可以让器前进的数据。当为时，意思是（54HAVE_ENOUGH_DATA以保证有足够的后续数据进行。seekingseekable定位置的数据，true表示浏览器正在请求数据，false表示浏览器seekable性返回一TimeRange象，该对象表示请求到的seeking和seekable属性值均为只读属性currentTime、startTimedurationcurrentTime属性来的当前位置，通过修改该属性没有获得，将产生INDEX_SIZE_ERR异常。startTime属性来的开始时间，通常为0。duration属性来文件总的时间。currentTime、startTime、duration属性的值为时间，单位为played、paused、played属性可以返回一个TimeRange对象，该对象中可以文件已经部分的时间段。该时间段的开始时间为已部分的开始时间，结束时间为已部分的结束时间。paused属性可以返回一个布尔值，表示是否处于暂停状态表示完毕，false表示没有完毕。played、pause、ended属性值均为只读属性defaultPlaybackRate、元素介绍defaultPlaybackRate属性或修改默认的速率playbackRate属性或修改当前的速率volume、元素介绍音，1为最大音量。表示处于静音状态，false表示处于非静音状四、和audio的方法audio素具有四种方法。使用play方法来，自动将元素的paused值变为false使用pause方法来暂停，自动将元素的paused值变为true使用load方法来重新载入进行，自动将元素的playbackRatedefaultPlaybackRate性的值，自动将元素的error的值变为null。元素介绍varsupportTypeInfo varsupportTypeInfo 可以在指定的字符串中加上表示编码格式的codes参数。该方法返3个可能空字符串：表示浏览器不支持此种类型maybe：表示浏览器可能支持此种类型probably：表示浏览器确定支持此种类型9-器<!doctype <style}}}}%;height:20px;} <div Player"width="552"><div <div<div <div<buttonid="btnPlay"onclick="PlayOrPause()"" "作

<buttonid="btnMute"onclick="setMute()"disabled/>静音<buttonid="btnVolumeUp"onclick="VolumeUp()" <divvarspeed=1;varvolume=1; varshowTime= { }function{varerror= {case case casecase4:的或 }}function{varbtnPlay= varbuttonDiv= }function{ {}}{}{var }function { var }function{ varprogress=.ge progress.value= var progressValue.style.width= }function{varhour;varminute;varif(hour.length== ='0'+if(minute.length== if(second.length==1) returnhour+":"+minute+":"+second;}function{ }function{}function{{}}function{ =*/}function{=*=* }function{ }function{varbtnSlowPlay= { }{ } }function{ { }{ } }function{ }function{ }}五、和audio的事事件处理方使用元素或audio元素或