HTML5 several common syntax for calling music players

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 be used to get objects through tags

4 Media = document.getElementById ("media");

Media Methods and properties:

Htmlvideoelement and Htmlaudioelement both inherit from Htmlmediaelement

01//Error status

Media.error; Null: Normal

Media.error.code; 1. User Termination 2. Network error 3 Invalid decoding error 4.URL

04//Network Status

MEDIA.CURRENTSRC; Returns the URL of the current resource

MEDIA.SRC = value; Returns or sets the URL of the current resource

Modified Media.canplaytype (type); If you can play a resource in a format

Media.networkstate; 0. This element is uninitialized 1. Normal but not using network 2. Downloading Data 3. No Resources found

Media.load (); Reload the resources specified by SRC

Ten media.buffered; Returns the buffered area, timeranges

One media.preload; None: metadata: Pre-load resource information auto:

12//Preparation 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 streaming media or resources that do not start with 0

Media.duration; Current resource length stream returns infinite

media.paused; Whether to pause

Media.defaultplaybackrate = value;//default playback speed, you can set

Media.playbackrate = value;//Current playback speed, set to change immediately after

media.played; Returns the area that has been played, timeranges, about this object see below

media.seekable; Returns the area timeranges that can be seek

media.ended; Whether to end

Media.autoplay; Whether to play automatically

Media.loop; Whether to cycle playback

Media.play (); Play

Media.pause (); Time out

29//Control

media.controls;//whether there is a default control bar

Media.volume = value; Volume

media.muted = value; Mute

//timeranges (Area) object

Timeranges.length; Number of regional segments

Start position of Timeranges.start (index)//Index section area

End position of timeranges.end (index)//Index section area

Event:

Eventtester = function (e) {

Media.addeventlistener (E,function () {

Console.log ((Newdate ()). GetTime (), E);

04});

05}

06

Modified Eventtester ("Loadstart"); Client starts requesting data

Eventtester ("Progress"); The client is requesting data

Eventtester ("suspend"); Deferred Downloads

Eventtester ("Abort"); The client voluntarily terminates the download (not due to an error),

One eventtester ("error"); Error encountered while requesting data

Eventtester ("stalled"); Speed stall

Eventtester ("Play"); Play () and AutoPlay start playback

Eventtester ("pause"); Pause () Trigger

Eventtester ("Loadedmetadata"); Resource length obtained successfully

Eventtester ("Loadeddata"); //

Eventtester ("Waiting"); Wait for data, not wrong

Eventtester ("playing"); Start playback

Eventtester ("Canplay"); Can play, but may be paused for loading

Eventtester ("Canplaythrough"); Can play, the songs are all loaded

Eventtester ("seeking"); In Search of

Eventtester ("seeked"); Search completed

Eventtester ("Timeupdate"); Play Time change

Eventtester ("ended"); Playback End

Eventtester ("Ratechange"); Playback rate Changes

Eventtester ("Durationchange"); Resource length Change

Eventtester ("Volumechange"); Volume change

Write a paragraph of their own JS:

01.$ (function () {

02.

var p = new Player ();

P.read ("Play");

05.

("#stop"). Click (function () {

P.pause ();

08.});

09.

$ ("#start"). Click (function () {

P.play ();

12.});

13.

$ ("#show"). Click (function () {

Alert (P.duration ());

16.});

17.

SetInterval (function () {

$ ("#currentTime"). Text (P.currenttime ());

20.},1000);

21st.

22.});

23.

24.function Player () {};

25.player.prototype = {

Box:new Object (),

Read:function (ID) {

This.box = document.getElementById (ID);

29.},

Play:function () {

This.box.play ();

32.},

Pause:function () {

This.box.pause ();

35.},

Src:function (URL) {

Panax This.box.src=url;

38.},

Currenttime:function () {

Return (THIS.BOX.CURRENTTIME/60). toFixed (2);

41.}

42.

43.};

44.player.prototype.duration=function () {

(THIS.BOX.DURATION/60). toFixed (2);

46.};