What does the html5 track tag mean? Introduction to how to use the html5 track tag

This article introduces the definition of the html5 track tag and how to use it, as well as some descriptions of the optional attributes of the html5 track tag. I hope everyone can read this article carefully.

html5 The definition and usage of the track tag:

The tag specifies an external text track for media such as video elements.

is used to specify subtitle files or other files containing text that are visible when the media is played.

html5 Tag optional attributes:

• default: default track. (value: default). The default attribute is used to notify the browser that the current track file can be used when the user does not choose to use other subtitle files.

• kind: the text type of the text track (values: captions, chapters, descriptions, metadata, subtitles). The kind attribute is used to specify the type of subtitle file (that is, a file used to store subtitles, chapter titles, description text, or metadata). The attribute values ​​that can be specified for the kind attribute are subtitles, captions, descriptions, chapters and metadata

• label: the label and title of the text track (value: text).

• src: URL of the track file, required attribute (value: URL). The src attribute is used to specify the storage path of the subtitle file. This attribute is a must-use attribute. The attribute value of the src attribute can be an absolute URL path or a relative URL path.

• srclang: Language for track text data. (value: language_code ). The srclang attribute is used to specify the language of the subtitle file. For example, srclang="en" and srclang="zh-cn" indicate that the subtitle file is English and Chinese respectively.

tag supports html global attributes and html event attributes

html5 track tag format:

<track src="URL">

HTML5 tag example

Video with two subtitle tracks:

<video width="320" height="240" controls>
<source src="forrest_gump.mp4" type="video/mp4">
<source src="forrest_gump.ogg" type="video/ogg">
<track src="subtitles_en.vtt" kind="subtitles" srclang="en"
label="English">
<track src="subtitles_no.vtt" kind="subtitles" srclang="no"
label="Norwegian">
</video>

Track object in html5

Track object is HTML5 Newly added.

The Track object represents the HTML5 element.

Accessing the Track object in html5

You can access the element by using getElementById():

var x = document.getElementById("myTrack");

Creating the Track object in html5

You can use the document.createElement() method to create the element:

var x = document.createElement("TRACK");

html5 Introduction to how to use the track tag:

track Elements can add text information such as subtitles, titles, or chapters to videos played using the video element or audio played using the audio element. The process of adding subtitles to video using the track element is the same as adding subtitles to audio. The track element is a child element of the video element, and the tag must be written between the start tag and the end tag of the video element. If the tag is used to describe a media file, the tag must be written after the tag. The track element is an empty element that does not contain any content between its start tag and end tag.

Browser support

Internet Explorer 10, Chrome and Opera support the tag.

Differences between HTML 4.01 and HTML 5

The tag is a new tag in HTML 5.

【Editor’s Recommendations】

html Detailed explanation of the usage of include tag (with usage examples)

html5 table Introduction to label style (attached is an example of html5 table css centering)

The above is the detailed content of What does the html5 track tag mean? Introduction to how to use the html5 track tag. For more information, please follow other related articles on the PHP Chinese website!