<object>タグの解説
<object>は、ドキュメントの中に外部リソースを読み込み、オブジェクトとして埋め込む際に使用します。この要素は、<img>や<embed>と違って終了タグを持っているため、その間に代替コンテンツやパラメーターを持たせておくことができます。
外部リソースとして想定されるのは、画像や動画、音声といったメディアファイル、PDFやHTML以外の文書ファイルなどです。埋め込みに必要なコンテンツは、基本的にURLで読み込みます。プラグインを介して操作するようなコンテンツの場合、この要素の範囲内に<param>を配置し、適切なパラメーターの設定を行います。
<object>タグの特徴
- レイアウトの初期値はインラインです。文章の改行には影響を与えません。
- 視覚的な効果は特に与えられませんが、範囲を指定すると内部にコンテンツが埋め込まれます。
- 同一のページ内に複数使うことができます。ただし、この要素自体を入れ子にすることはできません。
<object>要素に指定できる属性
data- リソースのURLを指定します。
data属性とtype属性は、どちらかひとつが必須となります。 typedata属性によって読み込まれるリソースの種別をMIMEタイプで指定します。data属性とtype属性は、どちらかひとつが必須となります。width- オブジェクトの幅を指定します。単位なし整数のピクセル値を受け入れます。
height- オブジェクトの高さを指定します。単位なし整数のピクセル値を受け入れます。
form- オブジェクトが
<form>と関連付けられる場合に、対象のidと一致する値を指定します。 name- 有効な閲覧コンテキストの名前を指定します。HTML4のバージョンではコントロールの名前となります。
usemap<map>と関連付ける場合に、参照するname属性の値と一致させます。- グローバル属性
- 全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。
- イベントハンドラ
- 全てのHTML要素に指定できるコンテンツ属性です。
<object>要素の使い方とサンプルコード
この要素の最も基本的な書き方は以下の通りです。data属性で埋め込むコンテンツのファイルを指定し、type属性でメディアタイプを定め、width属性とheight属性で寸法を決めます。
<object data="file" type="MIME" width="n" height="n"></object>
<object>の範囲には、代替コンテンツを配置することもできます。例えば、動画が読み込めなかった場合にサムネイル画像を表示させるには、以下の方法を取ります。
<object data="video/sample.mp4" type="video/mp4" width="720" height="480">
<img src="images/thumb.pmg" alt="Video Title">
</object>
HTMLの中に別の形式のドキュメントを埋め込む際にも利用できます。例えば、図表や楽譜などの内容をPDFで表示したい場合、次のように記述します。
<figure>
<object data="docs/sample.pdf" type="application/pdf"></object>
<figcaption>My Document Viewer</figcaption>
</figure>