iframe要素


今回はiframe要素を紹介します。iframe要素とは、新しいブラウジングコンテキストを作り文書中に配置するものです。
分かりにくい言い方ですが、あるページの中に、別のページを表示する枠のようなものを置くということです。
このような概念はフレームと呼ばれます。iframe要素で作られるフレームはインラインフレームと呼ばれます。

基本的な使い方


まず、src属性で、このブラウジングコンテキストに入れるページのアドレスを指定します。
例えば、<iframe src="http://google.com/"></iframe>のようにした場合、次のようになります。

枠ができてGoogleが表示されたと思います。
また、width属性・height属性があり、これによりインラインフレームの大きさを指定できます。
さらにname属性があり、これがブラウジングコンテキスト名です。前回target属性を紹介しましたが、ここでこの名前を指定すると、そのフレームの中身が変わります。
例えば、Yahoo!このリンクをクリックしてみましょう。target属性をさっきのフレームの名前にしているので、フレームが変わると思います。

srcdoc属性


さらに、特徴的な属性として、srcdoc属性があります。これは、中に表示されるページをURLで指定するのではなく、HTMLで直接書いて指定します。つまり、こういうことです。
 

<iframe srcdoc="<!doctype html>
<html><head><title>test</title></head>
<body><p>test</p></body></html>"></iframe>

という感じです。これを実際に試すとこうなります‥