HTML5はいくつかの埋め込まれたコンテンツ要素を定義します。これらの要素は、鳥瞰図から見ると、ほとんど同じであるという点に非常に似ているようです。

何の間の実際の差であるiframe、embedとobject？

サードパーティのサイトからHTMLファイルを埋め込む場合、これらの要素のどれを使用できますか、またどのように異なりますか？

<iframe>

iframe要素は、ネストされたブラウジングコンテキストを表します。HTML 5標準-「<iframe>要素」

主に他のドメインまたはサブドメインのリソースを含めるために使用されますが、同じドメインのコンテンツを含めるためにも使用できます。<iframe>『ライブや親文書と通信できるの強さは、埋め込まれたコードがあるということです』。

<embed>

HTML 5で標準化されていたが、その前は非標準タグであり、確かにすべての主要ブラウザで実装されていた。HTML 5より前の動作はさまざまです...

embed要素は、外部（通常は非HTML）アプリケーションまたはインタラクティブコンテンツの統合ポイントを提供します。（HTML 5標準-" <embed>要素"）

ブラウザプラグインのコンテンツを埋め込むために使用されます。これの例外は、標準に従って異なる方法で処理されるSVGとHTMLです。

埋め込みコンテンツで実行できることと実行できないことの詳細は、問題のブラウザープラグイン次第です。ただし、SVGの場合、次のような方法で親から埋め込みSVGドキュメントにアクセスできます。

svg = document.getElementById("parent_id").getSVGDocument();

埋め込まれたSVGまたはHTMLドキュメント内から、次の方法で親に到達できます。

parent = window.parent.document;

埋め込みHTMLの場合、（私が見つけた）親から埋め込みドキュメントにアクセスする方法はありません。

<object>

<object>要素は、ネストされたブラウジング・コンテキストとして、リソースのタイプに応じて、いずれかの画像として扱われ、外部リソースを表すことができ、または外部リソースとしてプラグインによって処理されます。（HTML 5標準-「<object>要素"）

結論

SVGや静的なものを埋め込む場合を除いて、おそらく使用するのが最善です<iframe>。SVGを含めるには<embed>（正しく覚えている場合）<object>スクリプトを作成させない†）。正直に言って<object>、古いブラウザやフラッシュ（私が使用していないもの）でない限り、なぜ使用するのかわかりません。

†以下のコメントで指摘されているとおり。のスクリプト<object>は実行されますが、親と子のコンテキストは直接通信できません。を使用<embed>すると、親から子のコンテキストを取得でき、その逆も可能です。これは、親でスクリプトを使用して子を操作できることを意味します。JavaScriptポストメッセージAPIなどの他のメカニズムを設定する必要がある場合、<object>またはそのような<iframe>場所では、その部分は不可能です。

objectover を使用する理由の1つiframeは、オブジェクトが埋め込みコンテンツのサイズをオブジェクトのサイズに合わせて変更することです。iPhone 4sのSafariで最も注目に値するのは320px、画面の幅が広く、埋め込みURLからのHTMLがより大きなサイズを設定する場合があることです。

objectiframeで使用するもう1つの理由は、objectサブリソース（リクエストが<object>実行されるときHTTP）がのpassive/display観点から考慮されるMixed contentためですMixed content。つまり、が必要な場合により安全です。

コンテンツが混在しているということhttpsは、リソースはあるがからのものである場合を意味しますhttp。

リファレンス：https : //developer.mozilla.org/en-US/docs/Web/Security/Mixed_content