source 要素

4.8.8 source 要素

Status: Last call for comments

カテゴリー
なし
この要素を使うことができるコンテキスト：
メディア要素の子として。ただし、フロー・コンテンツの前。
コンテンツモデル：
空
コンテンツ属性：
グローバル属性
src
type
media
DOMインタフェース：
interface HTMLSourceElement : HTMLElement {
           attribute DOMString src;
           attribute DOMString type;
           attribute DOMString media;
};

source 要素を使って、ウェブ制作者は、メディア要素のメディア・リソースを複数指定することができます。この要素は、自身では何も表しません。

src 属性は、メディア・リソースのアドレスを提供します。この値は妥当な URL でなければいけません。この属性は必須です。

type 属性は、メディア・リソースのタイプを与えます。このタイプは、ユーザーエージェントがメディア・リソースをフェッチする前に再生できるかどうかを決定する際に役立てられるものです。指定されたら、その値は妥当な MIME タイプでなければいけません。codecs パラメータを指定することができますが、それは、どのようにそのリソースがエンコードされているのかを正確に指定するために必要となるでしょう。 [RFC4281]

次のリストは、type属性の codecs= MIME パラメータをどうやって使うのかを示したものです。

H.264 Simple baseline profile video (main and extended video compatible) level 3 and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
H.264 Extended profile video (baseline-compatible) level 3 and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="avc1.58A01E, mp4a.40.2"'>
H.264 Main profile video level 3 and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'>
H.264 'High' profile video (incompatible with main, baseline, or extended profiles) level 3 and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="avc1.64001E, mp4a.40.2"'>
MPEG-4 Visual Simple Profile Level 0 video and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="mp4v.20.8, mp4a.40.2"'>
MPEG-4 Advanced Simple Profile Level 0 video and Low-Complexity AAC audio in MP4 container
<source src='video.mp4' type='video/mp4; codecs="mp4v.20.240, mp4a.40.2"'>
MPEG-4 Visual Simple Profile Level 0 video and AMR audio in 3GPP container
<source src='video.3gp' type='video/3gpp; codecs="mp4v.20.8, samr"'>
Theora video and Vorbis audio in Ogg container
<source src='video.ogv' type='video/ogg; codecs="theora, vorbis"'>
Theora video and Speex audio in Ogg container
<source src='video.ogv' type='video/ogg; codecs="theora, speex"'>
Vorbis audio alone in Ogg container
<source src='audio.ogg' type='audio/ogg; codecs=vorbis'>
Speex audio alone in Ogg container
<source src='audio.spx' type='audio/ogg; codecs=speex'>
FLAC audio alone in Ogg container
<source src='audio.oga' type='audio/ogg; codecs=flac'>
Dirac video and Vorbis audio in Ogg container
<source src='video.ogv' type='video/ogg; codecs="dirac, vorbis"'>
Theora video and Vorbis audio in Matroska container
<source src='video.mkv' type='video/x-matroska; codecs="theora, vorbis"'>

media 属性は、メディア・リソースのメディア・タイプを与えます。これは、ユーザーエージェントがフェッチの前にこのメディア・リソースがユーザーに利用可能なのかを決定する際に役立てられます。この値は、妥当なメディア・クエリでなければいけません。

もし media 属性が省略されたら、そのデフォルト値は "all" となります。これは、デフォルトで、メディア・リソースがすべてのメディアに対して適したものであることを意味します。

source 要素がメディア要素の子として挿入され、そのメディア要素は src 属性を持たず、その networkState が NETWORK_EMPTY という値を持つなら、ユーザーエージェントは、そのメディア要素のリソース選択アルゴリズムを呼び出さなければいけません。

IDL 属性 src, type, media は、同じ名前の対応するコンテンツ属性を反映しなければいけません。

ウェブ制作者は、提供するメディア・リソースがすべてのユーザーエージェントでレンダリングできるかどうか確信を持てないなら、最後の source 要素で error イベントをリッスンして、フォールバック・ビヘイビアを起動するようにすることができます：

<video controls autoplay>
 <source src='video.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
 <source src='video.ogv' type='video/ogg; codecs="theora, vorbis"'
         onerror="fallback(parentNode)">
 ...
</video>
<script>
 function fallback(video) {
   // replace <video> with its contents
   while (video.hasChildNodes())
     video.parentNode.insertBefore(video.firstChild, video);
   video.parentNode.removeChild(video);
 }
</script>

※ 原文：http://www.w3.org/TR/2010/WD-html5-20100304/video.html#the-source-element