установить innerHTML для iframe

Question

В javascript, как я могу установить innerHTML для iframe?Я имею в виду: как установить, не get .

window["ifrm_name"].document.innerHTML= "<h1>Hi</h1>" не работает, и то же самое для других решений.

Iframe и родительский документ находятся на одномdomain.

Мне нужно установить html всего документа iframe, а не его тела.

Мне нужно избегать решения jquery.

Answer 1

Действительно простой пример ...

<iframe id="fred" width="200" height="200"></iframe>

затем запускается следующий Javascript, либо встроенный, часть события и т. Д ...

var s = document.getElementById('fred');
s.contentDocument.write("fred rules");

«contentDocument» является эквивалентом «документа», который вы получаете в главном окне, поэтому вы можете делать вызовы для этого, чтобы установить тело, заголовок, любые элементы внутри ... и т. Д.

Я проверял это только в IE8, Chrome и Firefox ... так что вы можете проверить в IE6 / 7, если у вас есть доступные копии.

Answer 2

В Firefox и Chrome (не знаю об Opera) вы можете использовать схему data: URI .

 <iframe src=".... data: URI data here ......">

Пример JSFiddle

Здесь - это инструмент для генерации данных: данные в кодировке URI.

Это не работает в IE :

В целях безопасности URI данных ограничены загружаемыми ресурсами. URI данных нельзя использовать для навигации, создания сценариев или для заполнения элементов фрейма или фрейма.

Если, однако, как вы говорите в комментарии, достаточно получить / установить тело документа, вам будет гораздо легче воспользоваться одним из связанных примеров.

Answer 3

При улучшении загрузки файлов в AJAXS-среде я нуждался в том же.Это сработало для меня в ie8 и ff 22.0.И body innerhtml, и div innerhtml работают.

function copyframedata(data) {
  var x = document.getElementById("photo_mgr_frame");
  var y = x.contentWindow || x.contentDocument;
  if (y.document) y = y.document;
  y.getElementById('photo_mgr_mb').innerHTML = data;
}

получено из w3

Answer 4

Существует также атрибут srcdoc:

<iframe srcdoc="<p><h1>Hello</h1> world</p>"></iframe>

Демо , Polyfill .