object要素は、外部リソースを埋め込むために用いる要素です。
画像や映像、外部HTML、PDF等を埋め込むことができます。

要素の中には、object要素をサポートしていないブラウザで表示されるコンテンツを記述できます。
img要素で画像を表示させる場合、代替テキストはalt属性に記述しますが、object要素の場合は要素のコンテンツが代替テキストの役割を担います。

data属性に指定されたリソースが使用できない場合は、自身のコンテンツを表示させるため、object要素を複数回ネストさせることで複数回にわたる代替コンテンツを用意することができます。

意図通りに実装できているかどうか、ブラウザや支援技術の対応状況に注意する必要があります。

使用例

<object data="dummy.pdf" type="application/pdf" width="400" height="300">

<p>ご覧の環境では、object要素がサポートされていないようです。</p>

<p><a href="dummy.pdf">PDFファイルをダウンロードする(XXkb)</a></p>

</object>

後述するコード断片は、次に列挙するリストの順にリソースの埋め込みを試みる使用例です。

  1. webmファイルの埋め込みを試みる
  2. webmファイルに対応していない環境だった場合、pdfファイルの埋め込みを試みる
  3. pdfファイルに対応していない環境だった場合、pngファイルの埋め込みを試みる
  4. pngファイルに対応していない環境だった場合、代替テキスト(テーブル)を表示する
<object data="dummy.webm" type="video/webm" width="400" height="300">

<object data="dummy.pdf" type="application/pdf" width="400" height="300">

<object data="dummy.png" type="image/png" width="100" height="75">

<table>

<thead>

<td></td>

<th>見出し1</th>

<th>見出し2</th>

</thead>

<tbody>

<th>見出し3</th>

<td>値1</td>

<td>値2</td>

</tbody>

</table>

</object>

</object>

</object>

使用可能な属性

  • すべてのグローバル属性
  • data
  • type
  • typemustmatch
  • name
  • usemap
  • form
  • width
  • height

コンテンツカテゴリ

  • フローコンテンツ
  • フレージングコンテンツ
  • エンベディッドコンテンツ
  • インタラクティブコンテンツ
    • ただし、要素がusemap属性をもつ場合のみ
  • リストおよび提出可能 フォーム関連要素
  • パルパブルコンテンツ

子要素にしていい要素の種類

  • 0個以上のparam要素、それに続くトランスパレントコンテンツ

親要素にしていい要素の種類

  • 子要素にエンベディッドコンテンツが期待されているすべての要素

仕様書と策定状況

仕様書 策定状況
W3C 勧告
WHATWG Living Standard
最終更新:2017年9月5日

ミツエーリンクスでは、デジタルメディアにおける企業と顧客とのコミュニケーション課題を解決する、さまざまなサービスをご提供しています。ぜひ一度サービスページをご覧ください。

関連情報