目次
- 背景
- iFrameとは
1. 背景
業務でNuxt3への移行対応をしています。
以下の記事がiFrameを使って移行されたとのことです。
https://vuefes.jp/2023/sessions/mew-ton
iFrameについてまずは理解したいと思った為です。
2. iFrameとは
mdnを参考に説明します。
ネストになったブラウジングコンテキストを表現し、現在の HTML ページに他のページを埋め込むことができます。
mdnのdemoで説明します。
- 埋め込まれたブラウジングコンテキストはそれぞれ独自のドキュメントを持ち、URLナビゲーションを許可します。
- 他のブラウジングコンテキストを埋め込むブラウジングコンテキストは親ブラウジングコンテキストと呼ばれます。
- 一番上のブラウジングコンテキスト、つまり親を持たないコンテキストは、通常Windowオブジェクトで表されるブラウザウィンドウです。
- iframe内で表示されているコンテンツが別のページやウェブサイトであっても、その中で行われた操作やページの遷移は、ブラウジングの上位にある親のページのセッション履歴（ページの移動やアクションのログ）に統合されます。
属性の例
- src 埋め込むページのURLです。
- width フレームの幅（CSSピクセル）
- hight フレームの高さ（CSSピクセル）
- title フレームの目的や内容に関する簡単な説明