VideoTrack

VideoTrack インターフェイスは、<video> 要素からの単一の動画トラックを表します。 VideoTrack オブジェクトにアクセスするための最も一般的な用途は、その <video> 要素のアクティブ動画トラックにするために、その selected プロパティを切り替えることです。

プロパティ

selected
動画トラックがアクティブかどうかを制御する Boolean の値。 同時にアクティブにできる動画トラックは1つだけなので、別のトラックがアクティブなときに、あるトラックでこのプロパティを true に設定すると、アクティブであったトラックは非アクティブになります。
id 読取専用
メディア内のトラックを一意に識別する DOMString。この ID を使用して、VideoTrackList.getTrackById() を呼び出して、動画トラックリスト内の特定のトラックを見つけることができます。 メディアが Media Fragments URI 仕様その日本語訳)に従ってメディアフラグメントによるシークをサポートしている場合は、ID を URL のフラグメント部分として使用することもできます。
kind 読取専用
トラックが属するカテゴリを指定する DOMString。 例えば、メイン動画トラックには "main" という kind があります。
label 読取専用
トラックに人間が読めるラベルを提供する DOMString。 例えば、kind"sign" のトラックには "手話通訳" という label が付いている場合があります。 ラベルが指定されていない場合、この文字列は空です。
language 読取専用
動画トラックの主要言語を指定する DOMString、または不明の場合は空の文字列。 言語は、"en-US" または "pt-BR" などの BCP 47(RFC 5646)言語コードとして指定されています。
sourceBuffer 読取専用
トラックを作成した SourceBuffer。トラックが SourceBuffer によって作成されなかった場合、または SourceBuffer がその親メディアソースの MediaSource.sourceBuffers 属性から取り除かれた場合は、null を返します。

使用上の注意

特定のメディア要素の VideoTrack を取得するには、その要素の videoTracks プロパティを使用します。 このプロパティは、メディアに含まれる個々のトラックを取得できる VideoTrackList オブジェクトを返します。

var el = document.querySelector("video");
var tracks = el.videoTracks;

その後、配列の構文または forEach() などの関数を使用して、メディアの個々のトラックにアクセスできます。

この最初の例は、メディア上の最初の動画トラックを取得します。

var firstTrack = tracks[0];

次の例では、メディアのすべての動画トラックをスキャンして、(変数 userLanguage から取得した)ユーザーの優先言語の最初の動画トラックをアクティブにします。

for (var i = 0; i < tracks.length; i++) {
  if (tracks[i].language === userLanguage) {
    tracks[i].selected = true;
    break;
  }
});

language は標準(RFC 5646)形式です。 例えば、アメリカ英語の場合、これは "en-US" になります。

仕様

仕様 状態 コメント
HTML Living Standard
VideoTrack の定義
現行の標準  

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
VideoTrackChrome ? Edge 完全対応 ありFirefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
idChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
kindChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
labelChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
languageChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
selectedChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS 完全対応 ありSamsung Internet Android ?
sourceBufferChrome ? Edge 完全対応 12Firefox ? IE ? Opera ? Safari 完全対応 ありWebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

凡例

完全対応  
完全対応
実装状況不明  
実装状況不明