とにかく、iframe内にロードされたページをアンロードする方法はありますか?可能であれば、iframe srcを空白ページに変更したくありません。私は基本的に、この$('#frameID').attr("src","");
のようなことをするものを探していますが、コードは以前にロードされたページをクリアしないようです。
ありますか "unload"
呼び出すことができる関数で、iframeをリセットして、コンテンツがロードされないようにしますか?
他のソリューションではinnerHTML
を使用しますが、XHTMLでは常に機能するとは限りません。また、document.body
(<head>
はまだ存在しています)。 DOMを使用するソリューションは次のとおりです。
var frame = document.getElementById("myFrame"),
frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.removeChild(frameDoc.documentElement);
このソリューションではinnerHTML
を使用します。
var frame = document.getElementById("myFrame"),
frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.documentElement.innerHTML = "";
これを試して、
$("iframe").contents().find("body").html('');
内部のタグのinnerHTMLをクリアするだけで、実際にiframeをアンロードしないため、iframeを再ロードせずに再利用できます。
Iframeのコンテンツを動的に生成した場合、ロードされたすべてのスクリプト/変数が1つの書き込みから別の書き込みにリークします。したがって、@ Eliが提供するdom要素のクリアのソリューションは機能しません。
要するに:
きれいにするには、iframeをdiv要素にラップし、domコンテンツを置き換えます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div id="wrapper">
<iframe id="test"></iframe>
</div>
</body>
</html>
きれいにするため:
var wrapper = document.getElementById('wrapper');
wrapper.innerHTML= "<iframe id='test'></iframe>";
詳細:スクリプト漏洩のデモ
2つのiframe書き込み間のスクリプトリークの例(Chromeでテスト済み):
var iframe = document.getElementById('test');
// define variable 'a'
var content = "<html><body><script>var a=555;</script></body></html>";
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(content);
iframe.contentWindow.document.close();
// uncomment this to clean the iframe
//document.getElementById('wrapper').innerHTML= "<iframe id='test'></iframe>";
// write 'a' if defined
var content2 = "<html><body><div id='content'></div><script>document.getElementById('content').innerHTML=typeof a === 'undefined' ? 'undefined' : a;</script></body></html>";
var iframe2 = document.getElementById('test');
iframe2.contentWindow.document.open();
iframe2.contentWindow.document.write(content2);
iframe2.contentWindow.document.close();
このコードを実行すると、2番目のiframeの出力は555
最初のiframeで定義されていますが。
中間部分のコメントを外すと、期待どおりに機能します。
$( '#frameID')。contentWindow.document.body.innerHTML = '';
他のiframeと同様に、これは同じドメインにいる場合にのみ機能します。
ここでは、iframeを削除して再作成するのが最も賢明なソリューションです(他の答えに反することはありません)。
IframeのinnerHTML
のみを削除することにより、保存された変数、バインドされたeventListenersなどをフラッシュしません。
これに注意してください、それは多くの問題を引き起こす可能性があります(メモリリーク、同じイベントの複数のトリガーなど)。
var frame = document.getElementById("myframe");
frame.src = "about:blank";
これは私から働いて、メモリリークも防ぎました。私の場合、私も親を破壊しなければなりませんでした。その場合、メモリリークを防ぐために、少し遅れて親を破棄する必要があります
$("#frameId").contents().find("div#SomeDIVinsideFrame").remove(); // removes some div content inside iframe
$("#FrameId").remove(); // removes frame
http://www.livepage.info でiframeニュースを表示するのと同じ問題がありました
あなたはそのiframeのアンロードイベントを次のようにトリガーできます
$('body').trigger('unload');
その後、親ウィンドウからiframeを削除し、必要に応じて新しいsrcで新しいiframeをリロードします。
$('#iframe_wrapper').html('');
$('#iframe_wrapper').html('<iframe src="...">');
最初に、フレームのドキュメントを取得します。
var frame = $('#frameId').get(0);
var frameDoc = frame.contentDocument || frame.contentWindow.document;
次に、空白にします。
frameDoc.getElementsByTagName('body')[0].innerHTML = "";
私はこれもうまくいくと思う:
$('body', frameDoc).html("");
さて、頭にロードされている可能性のあるスクリプトで何かをしたいかもしれませんが、これはあなたを始めるはずです。
function getContentFromIframe(iFrameName)
{
var myIFrame = document.getElementById(iFrameName);
var content = myIFrame.contentWindow.document.body.innerHTML;
//Do whatever you need with the content
}
それは間違いなく動作します!!!!!!!!!!!!!!!!
Iframeのsrc
プロパティを設定して以前にコンテンツをロードしたことがある場合、クロスサイトスクリプティングの違反であるため、コンテンツを空にすることはできません。
その後、src
プロパティを''
に設定するだけで、ブラウザはコンテンツ全体を破棄します。
$('iframe').prop('src', '');
これでうまくいき、iframeタグ内のすべてがクリアされました。 body、head、htmlおよびすべて:
$("iframe").contents().empty();