Come impostare il contenuto HTML in un iframe

Ho una stringa HTMLCome impostare il contenuto HTML in un iframe

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

e voglio impostarlo su un iframe con JavaScript. Sto cercando di impostare il codice HTML in questo modo:

contentWindow.document.body.innerHTML

contentDocument.body.innerHTML

document.body.innerHTML

ma IE dà "Accesso negato". oppure "L'oggetto non supporta questa proprietà o metodo". o "Elemento finale non valido per l'azione". errori.

Ecco il mio codice completo:

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

fonte

2013-05-12 mr.boyfox

Perché non si carica una pagina funziona molto bene? perché vuoi usare una stringa da caricare? fammi sapere –

Si potrebbe utilizzare:

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

Ecco un jsFiddle, che opera in tutti i principali browser.

Si noti che invece di contentDocument.write si dovrebbe usare contentWindow.document.write: questo lo fa funzionare anche in IE7.

fonte

2013-05-15 05:51:08

Grazie per la modifica @ user1846192 –

nota, se stai leggendo e scrivendo dentro e fuori iframe, avrai bisogno di scrivere document.getElementById ('iframe1') contentWindow.document.write ("");. avere stringa vuota lettura simili var iframe_html = document.getElementById ('iframe_exe_uploader') contentWindow.document.body. .innerHTML; –

Avevo bisogno di usare open/close per farlo funzionare in chrome: iframe.contentWindow.document.open ('text/htmlreplace'); iframe.contentWindow.document.write (contenuto) ; iframe.contentWindow.document.close(); – Henry

Come su document.documentElement.innerHTML. Ma sappi che tutto nella pagina sarà sostituito anche dallo script che lo fa.

Per un iframe che sarebbe come questo myIFrame.contentWindow.document.documentElement.innerHTML

fonte

2013-05-12 06:49:24 user568109

Grazie per la tua risposta, ma se uso questo codice, ad esempio dico questo errore: "Elemento finale non valido per l'azione." –

Il innerHTML è un po 'difficile soprattutto in IE, in cui elementi come thead sono di sola lettura e causano un sacco di problemi.

In base alla documentazione su msdn, è possibile provare documentMode che fornisce una proprietà innerHTML.

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

questo potrebbe funzionare solo in IE.

fonte

2013-05-15 05:26:04 MatthiasLaug

prova questa nuova soluzione, ho aggiunto alcuni ulteriori controlli – MatthiasLaug

Grazie per la modifica, ma ho già accettato la risposta di @ user1846192 –

-2

provarlo:

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

aggiornamento:

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

fonte

2013-05-15 05:52:21 Binhvi

questo non funziona –

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

con HTML5 sarete in grado di utilizzare la srcdoc attribute.

fonte

2013-05-15 17:39:03 Christophe

@ mr.boyfox Corretto, avevo dimenticato le virgolette attorno alla stringa html. Questo dovrebbe funzionare in IE7 e IE8. – Christophe

sì !, ora funziona correttamente, grazie a @Christophe! –

Come impostare il contenuto HTML in un iframe

risposta

Problemi correlati