HTML5 Audio/video tags, properties, methods, events summary (GO)2011-06-28 13:16:48<audio> Tag Properties: src: Urlpreload of Music: preloaded AutoPlay: AutoPlay loop: Loop Play controls: Browser-brought control bar
1 <audioid= "Media" src= "Http://www.abc.com/test.mp3" controls></audio>
<video> Tag properties: src: Video urlposter: Video cover, No picture displayed when playing preload: Preload AutoPlay: AutoPlay loop: Loop Play controls: Browser's own control bar width: Video width height: video altitude
1 <videoid= "Media" src= "Http://www.abc.com/test.mp4" Controls Width= "400px" heigt= "400px" ></video>
Get Htmlvideoelement and Htmlaudioelement objects
1//audio can create objects directly from new
2 Media = Newaudio ("Http://www.abc.com/test.mp3");
3//audio and video can get objects by tag
4 Media = document.getElementById ("media");
Media Methods and properties:
Both Htmlvideoelement and htmlaudioelement inherit from Htmlmediaelement
01//Error status
Media.error; Null: Normal
Media.error.code; 1. User Termination 2. Network error 3. Decoding Error 4.URL invalid
04//Network Status
MEDIA.CURRENTSRC; Returns the URL of the current resource
MEDIA.SRC = value; Returns or sets the URL of the current resource
Media.canplaytype (type); Whether you can play a resource in a certain format
Media.networkstate; 0. This element is not initialized 1. Normal but not using network 2. Downloading Data 3. No Resources found
Media.load (); Reload the resource specified by SRC
Ten media.buffered; Returns the buffered area, timeranges
One by one media.preload; None: Do not preload metadata: Preload resource information Auto:
12//Readiness Status
Media.readystate; 1:have_nothing 2:have_metadata 3.have_current_data 4.have_future_data 5.have_enough_data
media.seeking; Are you seeking
15//Playback status
Media.currenttime = value; Current playback position, assignment can change position
Media.starttime; Typically 0, not 0 if it is a streaming medium or a resource that does not start at 0
Media.duration; Current resource length stream returns unlimited
media.paused; Whether to pause
Media.defaultplaybackrate = value;//The default playback speed, you can set
Media.playbackrate = value;//Current playback speed, change immediately after setting
media.played; Returns the area that has been played, timeranges, for this object see below
media.seekable; Returns the area that can be seek timeranges
media.ended; Whether to end
Media.autoplay; Whether to play automatically
Media.loop; Whether to loop playback
Media.play (); Play
Media.pause (); Time out
29//Control
media.controls;//If there is a default control bar
Media.volume = value; Volume
media.muted = value; Mute
//timeranges (Region) object
Timeranges.length; Number of Region segments
Start position of Timeranges.start (Index)//Section index area
Timeranges.end (index)//end position of the area of the index section
Event:
Eventtester = function (e) {
Media.addeventlistener (E,function () {
Console.log ((Newdate ()). GetTime (), E);
04});
05}
06
Eventtester ("Loadstart"); The client begins to request data
Eventtester ("Progress"); Client is requesting data
Eventtester ("suspend"); Delayed download
Ten Eventtester ("Abort"); The client actively terminates the download (not due to an error),
One eventtester ("error"); Error encountered while requesting data
Eventtester ("stalled"); Speed stall
Eventtester ("Play"); Triggers when play () and AutoPlay start playing
Eventtester ("pause"); Pause () Trigger
Eventtester ("Loadedmetadata"); Successful acquisition of resource length
Eventtester ("Loadeddata"); //
Eventtester ("Waiting"); Wait for data, not error
Eventtester ("playing"); Start playback
Eventtester ("Canplay"); Can be played, but may be paused halfway through loading
Eventtester ("Canplaythrough"); Can play, the songs are all loaded
Eventtester ("seeking"); Find in
Eventtester ("seeked"); Search Complete
Eventtester ("Timeupdate"); Play Time change
Eventtester ("ended"); Play End
Eventtester ("Ratechange"); Playback rate Change
Eventtester ("Durationchange"); Resource length Change
Eventtester ("Volumechange"); Volume change
HTML5 Audio/video tags, properties, methods, Event summary
