<object>の動作

objectでフレームのようにHTMLを埋め込んだ場合の動作。

FlashやJavaApplet、画像などを埋め込むobjectタグで、フレームのようにHTMLを埋め込んだ場合の動作を研究。 ブラウザによってその動作が違うことが分かった。

※テストブラウザのプラットフォームは全てWindows。

objectによるHTMLの埋め込み

データバインドなど、外部のテキストデータを直接埋め込むのではなく、フレームのようにobjectの枠内に外部ファイルを表示させる。 2005/07/20現在このサイトでも採用されている。

<object data="***.html" type="text/html" width="500" height="100">
代替テキスト
</object>

実際に埋め込んだ例

object.html

また、枠線を消すには埋め込むHTMLに次の記述を加える。

<style type="text/css">
<!--
html{
  border-style:none;
}
body{
  border-style:none;
}
-->
</style>
<body scroll="no">

object2.html

※IE以外はこんな設定しなくとも元々枠線は表示されない。

objectの持つURL

フレームなどの場合、JavaScriptでURL(location.href)を表示させると、埋め込まれたページのURLと埋め込んだ親ウインドウのURLが取得できる。 では、objectの場合どうだろうか?objectで読み込むファイルに次の記述をする。

<script type="text/javascript">
<!--
document.write('このウインドウのURL:',location.href);
document.write('<br>');
document.write('トップレベルのウインドウのURL:',top.location.href);
//-->
</script>

実際に記述した例。 この結果をブラウザごとに表にする。

object内で取得できるパス
ブラウザ名 location.href top.location.href
MSIE6 SP1 親ウインドウのパス 親ウインドウのパス
Mozilla Firefox1.x 読み込まれたファイルのパス 親ウインドウのパス
Opera7.x 読み込まれたファイルのパス 親ウインドウのパス
Netscape7.x 読み込まれたファイルのパス 親ウインドウのパス

見ての通り、IEだけ動作が違う。 IEの場合、objectに読み込まれたファイルのパスを、読み込まれたファイル自身は取得できない。 objectをフレームと認識していないせいだろう。

target属性の動作

続いて、object内でフレーム同様にtarget属性が働くかどうか実験する。

<a href="link2.html">属性なし</a><br>
<a href="link2.html" target="_blank">新規ウインドウ</a><br>
<a href="link2.html" target="_top">親ウインドウ</a><br>

実際に記述した例。この結果をブラウザごとに表にする。

object内でのtarget属性の働き
ブラウザ名 target無指定 新規(_blank) 親ウインドウ(_top)
MSIE6 SP1 同一ウインドウ 新規ウインドウ 同一ウインドウ
Mozilla Firefox1.x 同一ウインドウ 新規ウインドウ 親ウインドウ
Opera7.x 同一ウインドウ 新規ウインドウ 親ウインドウ
Netscape7.x 同一ウインドウ 新規ウインドウ 親ウインドウ

またもやIEだけ動作が違う。 IEはどう頑張ってもobjectの外に影響を与えることができない。 これもまたobjectをフレームと認識していないせいだろう。 しかも、JavaScriptなどはしっかりと独立しているので、親ウインドウに記述された関数を呼び出すこともできない。 IEではobjectで読み込まれたウインドウは"完全な隔離状態"になっている。

ページ情報

作成日時
2005/07/20
最終更新日時
2005/07/20
HTML4.01版
index.html
XHTML1.1版
index.xhtml
XML原本
index.xml