web-dev-qa-db-ja.com

srcなしのiframeですが、コンテンツはまだありますか?

サイトでjqueryコードをデバッグ中(chrome開発者ツールバー経由)

それらの例はIframeの下にあることに気付きました:

ここ-たとえば Iframeの下にあるサンプルがありますが、調査した後、IframeにSRCがないことがわかります

写真はすべてを示しています

enter image description here

質問:

SRCを設定せずにコンテンツをIframeに設定することは可能ですか?

追伸このメニューには空のコンテンツも表示されます

enter image description here

30
Royi Namir

はい、空の<iframe>srcを指定せずに)をロードし、後でスクリプトを使用してコンテンツを適用することができます。

参照: http://api.jquery.com/jquery-wp-content/themes/jquery/js/main.js (54行目以下)。

または、単に試してください:

<iframe></iframe>

document.querySelector('iframe')
        .contentDocument.write("<h1>Injected from parent frame</h1>")
34
haim770

はい、jQueryでiframeのhtmlを変更する方法は次のとおりです

var context = $('iframe')[0].contentWindow.document,
    $body = $('body', context);
$body.html('Cool');

デモ: http://jsfiddle.net/yBmBa/

document.contentWindow: https://developer.mozilla.org/en-US/d ...

6
iConnor

これはブラウザ間で最も互換性のあるソリューションであり、 W3C

<iframe src="about:blank"></iframe>
4
Oriol

はい。 iframedocumentオブジェクトへの参照を取得するには

var doc = iframe.contentDocument;

そして、現在のドキュメントで行うように要素を作成および追加できます。

Iframeにsrc属性がない場合でも、空のドキュメントが含まれます。少なくとも古いIEバージョンではsrc属性を設定する必要があります。そうしないと、iframeにドキュメントがありません。

iframeのcontentDocument も参照してください。

3
Felix Kling

与えてみてください:

src ="javascript:false;"
1
Aditya

JavaScriptとjQueryのベストアンサーを組み合わせて、ページ内のiframeごとにこのソリューションを考え出します。

<div class="iframewrapper ws-s-top mb-50" data-content="<!DOCTYPE html><html><head></head><body><p>Hello world</p></body></html>">
    <iframe frameborder="0" src=""></iframe>
</div>

$(".iframewrapper").each(function(){
    var html = $(this).attr("data-content");
    var iframe = $(this).find('iframe');
    var context = iframe[0].contentDocument.write(html);
    iframe[0].contentWindow.document.close(); //without this line, page loading animations won't go away!
});
0
Alex Jolig