track

<track> 要素は、メディアファイルのコンテナの外にある(アウトオブバンド: out-of-band)のテキストトラックを表します。トラックのタイプはkind 属性にキーワードで指定します。

カテゴリー
なし
配置場所
メディア要素(videoaudio)の子要素として、フロー・コンテンツよりも前に配置。
内容
なし(空要素)
属性
kind="トラックの種類"
トラックの種類をキーワードで指定します。省略された場合のデフォルト値はsubtitles(字幕)です。
subtitles 字幕。ビデオの上に重ねられます。
captions キャプション(見出し)。
descriptions 説明。
chapters 章。
metadata スクリプトからの使用を目的としたトラック。ブラウザに表示されません。
参考:https://www.w3.org/TR/2014/REC-html5-20141028/embedded-content-0.html#attr-track-kind

src="URL"
ファイル(主にWebVTTフォーマット)のURLを指定します。
srclang="言語コード"
テキストトラックの言語を指定します。値は有効なBCP47言語タグでなければなりません。kind 属性subtitles状態の場合はsrclang 属性は必須です。
label="トラックのタイトル"
ユーザーが読めるトラックのタイトルを指定します。字幕、キャプション、およびオーディオ記述トラックなどを表示する際に使用されます。
default[="default"]
別トラックが適切であるとユーザーの設定で示されてない場合に、デフォルトのトラックであることを示します。メディア要素の中で一つの<track> 要素のみ指定します。
グローバル属性

accesskey, autocapitalize, autofocus, class, contenteditable, data-*, dir, draggable, enterkeyhint, hidden, id, inputmode, is, itemid, itemprop, itemref, itemscope, itemtype, lang, nonce, spellcheck, style, tabindex, title, translate

サンプル

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>HTML5 › track</title>
</head>
<body>
<h1>HTML5 › track</h1>


<video preload autoplay loop controls width="480" height="360" id="mov">
<source src="https://emwai.jp/files/reference/html5/iStock_000009283938PAL.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<track label="字幕" kind="subtitles" src="https://emwai.jp/files/reference/html5/iStock_000009283938PAL.subtitles.vtt" srclang="ja" default>
</video>

<p>
<span id="pause">停止</span> |
<span id="play">再生</span>
</p>

<script>
var mov = document.getElementById('mov');

document.getElementById('pause').addEventListener('click', function(){
  mov.pause();
});
document.getElementById('play').addEventListener('click', function(){
  mov.play();
});
</script>
</body>
</html>