Jon Davis wrote:
I recently learned how to do an <OBJECT> alternative to <IFRAME> in current
browsers using:
<object id="extendedhtml" type="text/html" data="otherpage.html" width="250"
height="400"></object>
My question is how do I access the document DOM of this object in
Javascript? For example, "alert(extendedhtml.innerHTML);" doesn't work and
produces an unknown error. I'd like to both read and write to the document's
body element's innerHTML property, as well as access its full DOM (forms,
etc) as I would access the elements of the main page.
The W3C DOM is documented here:
http://www.w3.org/TR/DOM-Level-2-HTML/
with the HTMLObjectElement being documented here:
http://www.w3.org/TR/DOM-Level-2-HTM...tml#ID-9893177
so there you will see that according to that specification there is a
property
contentDocument
meaning in browsers implementing that specification you can acess
document.getElementById('extendedhtml').contentDoc ument
e.g. if you really want to access the innerHTML of the <body> element of
the document loaded in the <object>
var objDoc = document.getElementById('extendedhtml').contentDoc ument;
... objDoc.body.innerHTML ...
Only problem is that MSIE doesn't know contentDocument at all, its
documentation of <object> element is here
http://msdn.microsoft.com/library/de...cts/object.asp
It seems however that MSIE exposes the document inside of the <object>
via the property
object
so the code to work with MSIE and with DOM Level 2 browsers like Mozilla
or recent Opera 7 versions is:
<html lang="en">
<head>
<title>object scripting in MSIE and in DOM Level 2 HTML browsers</title>
<script type="text/javascript">
window.onload = function (evt) {
var obj;
if (document.getElementById && (obj =
document.getElementById('htmlObject1'))) {
var objDoc;
if (obj.contentDocument) {
objDoc = obj.contentDocument;
}
else if (obj.object) {
objDoc = obj.object;
}
if (objDoc && objDoc.body) {
alert(objDoc.body.innerHTML);
}
}
};
</script>
</head>
<body>
<p>
<object id="htmlObject1"
type="text/html"
data="jsInterpreter.html"
width="100%"
height="300"></object>
</p>
</body>
</html>
Crosspost and followup-to to comp.lang.javascript.
--
Martin Honnen
http://JavaScript.FAQTs.com/