23

У меня есть HTML строкуКак установить содержимое HTML в IFRAME

<html> 
    <body>Hello world</body> 
</html> 

, и я хочу, чтобы установить его в IFRAME с JavaScript. Я пытаюсь установить HTML как это:

contentWindow.document.body.innerHTML 

или

contentDocument.body.innerHTML 

или

document.body.innerHTML 

но IE дает "доступ запрещен." или «Объект не поддерживает это свойство или метод». или «Недопустимый конечный элемент для действия». ошибки.

Вот мой полный код:

<!DOCTYPE html> 
<html> 
    <head> 
    <script type="text/javascript" src="jquery_1.7.0.min.js"/> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
     var htmlString = "<html><body>Hello world</body></html>"; 
     var myIFrame = document.getElementById('iframe1'); 
     // open needed line commentary 
     //myIFrame.contentWindow.document.body.innerHTML = htmlString; 
     //myIFrame.contentDocument.body.innerHTML = htmlString; 
     //myIFrame.document.body.innerHTML = htmlString; 
     //myIFrame.contentWindow.document.documentElement.innerHTML = htmlString; 
     }); 
    </script> 
    </head> 
    <body> 
    <p>This is iframe: 
     <br> 
     <iframe id="iframe1"> 
     <p>Your browser does not support iframes.</p> 
     </iframe> 
    </body> 
</html> 
+0

Почему вы не загружаете страницу, она работает очень хорошо? почему вы хотите использовать строку для загрузки? дайте мне знать –

ответ

38

Вы могли бы использовать:

document.getElementById('iframe1').contentWindow.document.write("<html><body>Hello world</body></html>"); 

Вот jsFiddle, который работает во всех основных браузерах.

Обратите внимание, что вместо contentDocument.write вы должны использовать contentWindow.document.write: это заставляет его работать и в IE7.

+0

Спасибо за редактирование @ user1846192 –

+0

Обратите внимание, что если вы читаете и записываете ифрагмент iframe, вам нужно будет написать document.getElementById ('') iframe1 contentWindow.document.write ("");. иметь пустую строку чтения, как этот вар iframe_html = document.getElementById ('') iframe_exe_uploader contentWindow.document.body. .innerHTML; –

+1

Мне нужно было использовать open/close, чтобы он работал в chrome: iframe.contentWindow.document.open ('text/htmlreplace'); iframe.contentWindow.document.write (content) ; iframe.contentWindow.document.close(); – Henry

0

Как насчет document.documentElement.innerHTML. Но знайте, что все на странице будет заменено даже скриптом, который это делает.

Для фрейма было бы, как этот myIFrame.contentWindow.document.documentElement.innerHTML

+0

Спасибо за ваш ответ, но если я использую этот код, то скажу эту ошибку: «Недействительный конечный элемент для действия." –

5

The innerHTML немного сложнее, особенно в IE, где элементы, такие как thead считываются только и вызывают много неприятностей.

На основании документации по msdn вы можете попробовать documentMode, который предоставляет innerHTML.

myIFrame = myIFrame.contentWindow || 
    myIFrame.contentDocument.document || 
    myIFrame.contentDocument; 
myIFrame.document.open(); 
myIFrame.document.write('Your HTML Code'); 
myIFrame.document.close(); 

это может работать только в IE.

+0

попробуйте это новое решение, я добавил некоторые дополнительные проверки – MatthiasLaug

+0

Спасибо за редактирование, но я уже принял ответ @ user1846192 –

-2

попробовать:

$('iframe').load(function() { 
    $(this).contents().find('body').append("Hello world"); 
}); 

обновление:

$(function(){ 
    $('iframe').load(function() { 
     $(this).contents().find('body').append("Hello world"); 
    }); 
}) 
+1

это не работает –

15
var htmlString="<body>Hello world</body>"; 
var myIFrame = document.getElementById('iframe1'); 
myIFrame.src="javascript:'"+htmlString+"'"; 

С html5 вы будете иметь возможность использовать srcdoc attribute.

+1

@ mr.boyfox Исправлено, я забыл кавычки вокруг строки html. Это должно работать в IE7 и IE8. – Christophe

+0

да !, теперь работает правильно, спасибо @ Кристофе! –