<object> 外部リソースをページに埋め込む
| 取り扱い | 現行の標準 |
| カテゴリ |
フロー・コンテンツ フレージング・コンテンツ エンベッデッド・コンテンツ パルパブル・コンテンツ usemap属性が与えられた場合、インタラクティブ・コンテンツ |
| 親にできる要素 | エンベッデッド・コンテンツを受け入れる要素 |
| 子にできる要素 | <param>とそれに続くトランスパレント・コンテンツ |
| 対応ブラウザ | caniuseで確認 |
<object>タグの説明
<object>は、ドキュメントの中に外部リソースを読み込み、オブジェクトとして埋め込む際に使用します。この要素は、<img>や<embed>と違って終了タグを持っているため、その間に代替コンテンツやパラメーターを持たせておくことができます。
外部リソースとして想定されるのは、画像や動画、音声といったメディアファイル、PDFやHTML以外の文章ファイルなどです。埋め込みに必要なコンテンツは、基本的にURLで読み込みます。プラグインを介して操作するようなコンテンツの場合、この要素の範囲内に<param>を配置し、適切なパラメーターの設定を行います。
<object>タグの特徴
- レイアウトの初期値はインラインです。文章の改行には影響を与えません。
- 視覚的な効果は特に与えられませんが、範囲を指定すると内部にコンテンツが埋め込まれます。
- 同一のページ内に複数使うことができます。ただし、この要素自体を入れ子にすることはできません。
<object>に指定できる主な属性
- data
- リソースのURLを指定します。
data属性とtype属性は、どちらか一つが必須となります。 - type
data属性によって読み込まれるリソースの種別をcontent typeで指定します。data属性とtype属性は、どちらか一つが必須となります。- width
- オブジェクトの幅を指定します。
- height
- オブジェクトの高さを指定します。
- form
- オブジェクトが
<form>と関連付けられる場合に、対象のidと一致する値を指定します。 - name
- 有効な閲覧コンテキストの値を設定します。
- usemap
<map>と関連付ける場合に、参照するname属性の値と一致させます。- グローバル属性
- 全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。
- イベントハンドラ
- 全てのHTML要素に指定できるコンテンツ属性です。
<object>の使い方とサンプル
このタグを使ったマークアップのサンプルです。
HTML
<object type="application/x-shockwave-flash" data="flash/sample.swf" width="100" height="100" id="flash-sample">
<param name="movie" value="flash/sample.swf">
</object>