Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

Lesson 3: Using the HTMLMediaElement object CHAPTER 11 447

A. .mp4

B. .wav

C. .h264

D. .oga

Lesson 3: Using the HTMLMediaElement object

The <audio> and <video> elements inherit from an HTMLMediaElement object, so they

inherit the properties, methods, and events that are defined on the HTMLMediaElement

object.

After this lesson, you will be able to:

■■Describe the HTMLMediaElement object.

■■Subscribe to the HTMLMediaElement events.

■■Control media.

Estimated lesson time: 20 minutes

Understanding the HTMLMediaElement methods

You can use the members of the HTMLMediaElement object to control the video and audio

playback. You can also get notifications of status changes. The following is a list of the

<video> element methods.

■■addTextTrack() Adds a new text track to the audio or video

■■canPlayType() etermines whether the browser can play the specified audio or D

video type

■■load() Reloads the audio or video

■■play() Plays the audio or video

■■pause() Pauses the currently playing audio or video

Using HTMLMediaElement properties

In addition to the methods that enable you to control playback, you can use many properties

to view or set the state of the <audio> or <video> element. The following is a list of all the

properties.

■■audioTrack s Gets a reference to the AudioTrackList object that has the available

audio tracks

■■autoplay Sets or gets the indicator that determines whether the audio or video

should start playing when it’s loaded