Forum Moderators: open
What I am looking for is a JS function to load a html into a <div> tag.
I had one some time ago and can only remember part of it as follows
function loadhtm(file,id);
dd=GetElementbyID(id); (or something like that)
can anyone help
It can also be done with AJAX.
In both cases security may stop you if file is from different domain
Kaled.
IFRAMEs don't seem to support the innerHTML property, even for local files. (?)
Actually, that wasn't quite strictly true... there is an innerHTML property, but in both IE and FF it has the value "Iframe not supported!". In Opera it's simply an empty string.
frame.document.body.innerHTML
Wow, yeah, (cheers Kaled) but this appears to be IE and Opera only. In Opera it works as expected, but in IE6 it returns the body of the parent document (eh?!) - the document that contains the IFRAME ...?!? (And where the contents of the IFRAME should be it says "Iframe not supported!".)
FF supports the contentDocument property (instead of 'document') and works as expected.
The function I was using...
// IE, Opera... iframe.document.body.innerHTML
// (But IE returns current (parent) document!?)
// FF... iframe.contentDocument.body.innerHTML
function getIframeContents () {
var obj = document.getElementById('myiframe');
if (obj.document) {
alert('iframe.document.body.innerHTML = ' + obj.document.body.innerHTML);
}
else if (obj.contentDocument) {
alert('iframe.contentDocument.body.innerHTML = ' + obj.contentDocument.body.innerHTML);
}
}
IE also has .outerHTML - but this just contains the IFRAME tags and doesn't give access to the document inside the IFRAME ("Iframe not supported!" message again.)
So, how do you get "frame.document.body.innerHTML" to work in IE?
------- ADDED ------
NB: This is just the <body> of the containing document, not the entire HTML file. But I guess you would have problems if you tried to insert and entire HTML file (<DOCTYPE><head> and all) into an already complete HTML document?!
So, how do you get "frame.document.body.innerHTML" to work in IE?
You write an onload event handler for the document in the <iframe>. That handler must locate the <div> in the parent window and assign its innerHTML value.
e.g.
<head>
<script>
function copyToDiv() {
var div = parent.document.getElementById(targetDiv);
if (div) div.innerHTML = self.document.body.innerHTML;
}
</script>
</head>
<body onload="copyToDiv();">
</body>
Kaled.
Penders, for case of IE, add this to start of getIframeContents
if (obj.contentWindow) {
alert('innerHTML = ' + obj.contentWindow.document.body.innerHTML);
} else ...
And Kaled's solution works great the other way round... to 'send' the contents (body) of the document in the IFRAME, from the IFRAME to the parent document. Works in everything I tried... IE5, IE6, FF and Opera.
I also have reason to believe it won't work in Safari.
[edited by: Rambo_Tribble at 2:17 am (utc) on Sep. 17, 2006]
