Iframe без src, но все еще имеет контент?

При отладке кода jquery на своем сайте (через панель инструментов Chrome chrome)

Я заметил, что их примеры приведены под Iframe:

Здесь, например, есть образец, который находится под IFrame, но после исследования я вижу, что Iframe не имеет SRC

На рисунке показано все

Вопрос:

Можно ли установить контент в iframe без установки его SRC?

p.s. это меню также показывает мне пустой контент

Ответ 1

Да, можно загрузить пустой <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>")

Ответ 2

Да, вот как вы меняете html iframe с помощью jQuery

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...

Ответ 3

Похоже, это наиболее совместимое решение в браузерах, а также оно распознается W3C

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

Ответ 4

Конечно. Вы можете получить ссылку на объект iframe document с помощью

var doc = iframe.contentDocument;

а затем вы можете создавать и добавлять такие элементы, как в текущем документе.

Если iframe не имеет атрибута src, он все равно будет содержать пустой документ. Я полагаю, что хотя бы более старые версии IE требуют установки атрибута src, в противном случае iframe не будет иметь документа.

Смотрите также: contentDocument для iframe.

Ответ 5

Попробуйте дать:

src ="javascript:false;"

Ответ 6

Смешивая лучшие ответы в 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!
});