object

1. 基本情報

説明 汎用オブジェクトを埋め込む
語源 general OBJECT
所属モジュール Object
所属コンテントセット Inline
内容 PCDATA, Flow, param
内容の書式 ( PCDATA | Flow | param )*
関連項目 head, img
公式な実装 DTD

2. 属性

2-1. 一般属性

属性 属性値の型 説明
Common [属性コレクション]

XHTMLの要素が大抵持っている、一般的な属性を集めたコレクションです。

2-2. 固有属性

属性 属性値の型 説明
data URI (CDATA)

オブジェクトのデータのURIを指定します。

type ContentType (CDATA)

リンクするリソースのコンテントタイプを指定します。

classid URI (CDATA)

Javaアプレットなどの実行ファイルのURIを指定します。

codetype ContentType (CDATA)

classid属性で指定したリソースのコンテントタイプを指定します。

archive URIs (CDATA)

オブジェクトの使用するデータファイルなどをまとめたアーカイブのURIを指定します。

codebase URI (CDATA)

data属性classid属性archive属性を相対参照で指定した時の基準となるURIを指定します。head要素の中に書くbase要素に似ています。

standby Text (CDATA)

オブジェクトのダウンロードが終わるまで表示させておく文章を示します。

declare [選択]

オブジェクトを完全にダウンロードした後、自動実行するかどうかを指定します。

  • declare - オブジェクトを宣言するだけにとどめ、自動的な実行を行わなくなります。
width Length (CDATA)

要素の幅を指定します。

height Length (CDATA)

要素の高さを指定します。

usemap IDREF

クライアントサイドイメージマップを使用する時、使用するmap要素のID参照を指定します。

name CDATA

コントロールの名前を指定します。ラジオボタンやチェックボックスでは、同一フォーム内で値を重複させる事がままあります。

tabindex Number (CDATA)

タブインデックスを指定します。通常、Tabが押されるとユーザーエージェントはリンクを最初から順番に辿っていきますが、この属性で明示的に指定する事ができます。

3. 解説

3-1. 概要

object要素は汎用オブジェクトを表します。汎用過ぎて、何をobject要素で実現すればいいのか判らないような所もありますが、一般的にはimg要素やHTML 4.01などにあるapplet要素の上位互換、ブラウザ依存のembed要素などの代替手段などと考えればいいでしょう。また、iframe要素の代わりなんてのもできます。

objectの用途は多岐に渡り、ユーザーエージェントのプラグインの力を借りる事で実に多彩な力を発揮します。できる事が多い分把握するのも大変で、加えて僕はJavaアプレットとかFlashとかに詳しい訳ではないので、具体的な設置方法は専門のマニュアルに任せます。ここではobject要素の概略を解説します。

3-2. 画像の埋め込み

最も基本的な使い方です。img要素のように、画像を埋め込みます。

[プログラムコード開始]

<object data="/image/valid-xhtml11.png" type="image/png">Valid XHTML 1.1</object>

[プログラムコード終了]

img要素との違いは、

  • img要素ではsrc属性だったが、object要素ではdata属性を使う。
  • ContentTypeデータタイプを指定できる。確かに、ユーザーエージェントはHTTPリクエストをした時にコンテントタイプを知る事ができる為必須ではないが、無用な(自分では解釈できない種類の)画像だった場合、わざわざダウンロードをせずに済む。また、新しい画像フォーマットに対して、サーバの設定ファイルで対応できない時、ユーザ側で対応できる。
  • 代替テキストは内包するimg要素のように、alt属性longdesc属性で不便な思いをする必要が無い。

特に代替テキストの扱われ方は重要です。代替テキストは、data属性で指定された画像が表示できなかった場合に描画されます。例えば、グラフィカルブラウザがそのフォーマットに対応していなかった時とか、そもそもテキストブラウザであった時、音声合成ユーザーエージェントであった時などです。必ずやページの閲覧者全員が画像を表示できるなどと思ってはいけません。そんな風に考えていると、テキストブラウザや音声合成ユーザーエージェントで見た時、意味不明になります。

代替テキストは必須です。それなのに書式が( PCDATA | Flow | param )*なのは、head要素の中で使われる事を想定している為で、body要素の中で使う場合はきちんと代替テキストを書きましょう。

3-3. ネストしたobject要素

先程から代替テキスト代替テキストと書いていますが、勿論alt属性のようにCDATAデータタイプしか書けない訳ではありません。むしろ、Flowコンテントセットを内容に持てるのです。前述の通り、ユーザーエージェントはdata属性の内容が描画できない時に、その中身を解釈して代わりにそれを描画する事を試みますから、次のような事が可能となる訳です。

[プログラムコード開始]

<object data="/image/valid-xhtml11.png" type="image/png">
<object data="/image/valid-xhtml11.gif" type="image/gif">
<object data="/image/valid-xhtml11.jpeg" type="image/jpeg">
<p><em>Valid</em> XHTML 1.1</p>
</object>
</object>
</object>

[プログラムコード終了]

上記の例では、PNG、GIF、JPEGの各画像を描画する事を試み、どうしても駄目な場合に代替手段としてテキストを描画します。あるいは、object要素に対応していないブラウザが多いと思うならば、

[プログラムコード開始]

<object data="/image/valid-xhtml11.png" type="image/png">
<object data="/image/valid-xhtml11.gif" type="image/gif">
<object data="/image/valid-xhtml11.jpeg" type="image/jpeg">
<img src="/image/valid-xhtml11.png" alt="Valid XHTML 1.1"/>
</object>
</object>
</object>

[プログラムコード終了]

とやってもいいでしょう。

3-4. その他のメディアファイルの埋め込み

殆ど画像の場合と一緒です。例えば、MPEGフォーマットの動画を埋め込む場合、

[プログラムコード開始]

<object data="/movie/review/w3m.mpeg" type="application/mpeg">w3mのレビュー</object>

[プログラムコード終了]

とやれば簡単に埋め込めます。プレーヤは指定していませんから、どう表示されるかはユーザーエージェントに依存します。

3-5. 外部文書の埋め込み

画像などと同様に、文書(XHTML文書など)を埋め込む事もできます。XHTML 1.1では、iframe要素がありませんから、代替手段としても使えるでしょう(多少の差異はありますが)。XHTML文書の場合は、まず表示できる(コンテントタイプによって弾かれる事は無い)と考えられるので、type属性は書かなくてもいいでしょう。

[プログラムコード開始]

<object data="/history/headline.html">
<p><a href="/history/headline.html">ヘッドライン</a>が自動的に読み込めませんでした。</p>
</object>

[プログラムコード終了]

object要素で埋め込まれた文書は、埋め込み元の文書から独立的に描画されます──例えば、埋め込まれた文書の中で<a href="./index.html">目次</a>というリンクが張られていた場合、この相対参照は、埋め込まれた文書のあるディレクトリや、その文書中のbase要素を使って解決されます。埋め込み元の文書のあるディレクトリや、そのbase要素は影響を与えません。

なお、文書の埋め込みに限った事ではないですが、埋め込んだ文書は他の人の著作であるのに、あたかも自分が書いたように見せかける偽装はするべきではありませんa要素でリンクを張る場合、ステータスバーなどに現れるサーバの名前や階層構造から違う人が書いたものだとすぐ判りますが、object要素で埋め込まれるとその判別は困難(無論不可能ではない)になります。

3-6. アプレットの埋め込み

Javaアプレット、ActiveXコントロールなどのプログラムを埋め込む事ができます。Javaアプレットの場合、classid属性で実行ファイルの所在を示し、codetype属性でコンテントタイプを明示します。

[プログラムコード開始]

<object classid="java:clock.start" codetype="application/java-archive">
アナログ時計
</object>

[プログラムコード終了]

ActiveXオブジェクトは、classid属性でコンテントタイプをGUIDで記述し、data属性で実行ファイルの所在を示すとの事。

[プログラムコード開始]

<object classid="clsid:663C8FEF-1EF9-11CF-A3DB-080036F12502" data="clock.stm">
アナログ時計
</object>

[プログラムコード終了]

繰り返しますが、僕は全然詳しくないので、きちんとマニュアルでで確認して下さい。

3-7. パラメータ付きオブジェクト

今までの例は非常に簡単なものでしたが、一般的にはもっと沢山のパラメータが必要になります。この場合、param要素を内包する事で対応します。例として、Macromedia Flashファイルを埋め込んでみます。

[プログラムコード開始]

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/ flash/swflash.cab#version=7,0,0,0" width="100" height="100">
<param name="movie" value="moviename.swf"/>
<param name="play" value="true"/>
<param name="loop" value="true"/>
<param name="quality" value="high"/>
<p>Flashアニメーションが再生できません。<a href="http://www.adobe.com/shockwave/download/?P1_Prod_Version=ShockwaveFlash&amp;Lang=Japanese">Flash Player ダウンロードセンター</a>でFlash Playerの最新版を入手して下さい。</p>
</object>

[プログラムコード終了]

上の例は、ほぼFlash ユーザーガイドから引っ張ってきたので、まず間違いないでしょう。ただ、HTML 4.01の仕様書には、codebase属性について、This attribute specifies the base path used to resolve relative URIs specified by the classid, data, and archive attributes. When absent, its default value is the base URI of the current document.(Quoted from codebase )と書かれているのに、Flashではプレーヤの位置を指定する為に使われていますね。歴史的な経緯なんでしょうか?

ちなみに、XHTML 1.1にはembed要素は無いので、objectの内容としてembed要素を書いてはいけません。ちなみに、embedはHTML 4.01 Transitionalにも入っていない、Netscape社の独自拡張要素らしいです(とほほのWWW入門 - HTMLリファレンス - embedによると)。

3-8. 宣言オブジェクト

declare属性を使うと、ユーザーエージェントがobject要素を解釈しても、すぐには実行を開始せず、他のきっかけが与えられるまで実行を延期します。

[プログラムコード開始]

<object id="promotion-video" data="promotion.mpeg" type="application/mpeg" declare="declare">
<p><a href="promotion.mpeg">アルバム販売促進用プロモーションビデオ</a>。</p>
</object>
<!-- …… -->
<p><a href="#promotion-video">プロモーションビデオの再生</a></p>

[プログラムコード終了]

この例では、declare属性付きで記述したobject要素を、あとでa要素でアクティブ化しています。つまり、リンクが選択されるまで動画の再生が始まりません。また、object要素を特定するには、id属性を使います。

また、共通するデータの読み込みを一度しか行わず、後で何回も再利用するような場合、共通するデータを予め宣言しておく事ができます。

[プログラムコード開始]

<object id="background-forest" data="forest.png" type="image/png" declare="declare">
</object>
<!-- …… -->
<object classid="16-puzzle.program">
<param name="question" valuetype="ref" type="image/png" value="rabbit.png"/>
<param name="background" valuetype="object" value="#background-forest"/>
森の背景の中で、うさぎの絵を並べ替える16パズル。
</object>
<!-- …… -->
<object classid="clock.program">
<param name="background" valuetype="object" value="#background-forest"/>
文字盤に森の絵が描かれたアナログ時計。
</object>

[プログラムコード終了]

上の例は、16-puzzle.programとclock.programで、同じforest.pngを使う時に、どのようにそのリソースをプログラムに渡すかを示したものです。XHTML側ではこのように渡しますが、プログラムの中でどのように受け取るかはプログラムの種類によるでしょう。ともかく、このようにすれば、forest.pngは最初の一回だけ読み込まれ、declare属性が付いたobject要素では描画されず、残り二つのobject要素で内部的に使用する事ができます。この用法は、共通するデータが多ければ多いほど威力を発揮するでしょう。

3-9. オブジェクトコントロール

object要素の内容を値として、フォームのコントロールになる事ができます。つまり、コントロール名をname属性で指定すれば、値として内容、例えば<object name="object-control" data="./valid-xhtml11.png" type="image/png">とやれば./valid-xhtml11.pngの内容が送信されるらしいのですが、どうも規格ばかりで実装しているユーザーエージェントは無いようです。

3-10. 使用例

解説を参照して下さい。なお、object要素はFlowコンテントセットを持つ事ができますが、自分自身はInlineコンテントセットに含まれるので、間違えないよう気を付けて下さい。

[object]
Published : 2006-03-26T09:00:00+09:00
Last Modified : 2006-12-07T09:00:00+09:00
Table of Contents : 要素目次
Index : 要素索引
Verified with : Valid XHTML 1.1
Copyright © 2006  E+X.