faqts : Computers : Programming : Languages : JavaScript : DHTML : DOM

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

15 of 20 people (75%) answered Yes
Recently 7 of 10 people (70%) answered Yes

Entry

Cannot access text data contained in a known-good object element

Nov 23rd, 2002 12:19
Klaus Bolwin, Mark Filipak,


This is a Javascript/DOM2 problem.
To receive the contents of the file, myURI, I've created an HTML object
with this:
  <object id='myId' data='myURI'>myDefaultText</object>
Of course, I hide the text that is downloaded into my container, thus:
  <style>#myId {position:absolute;visibility:hidden;}</style>
When the page loads, the myId container is there. I can see it when I
make it visible, and it does have the file, myURI, in it -- the file is
plain text -- but I can't find or read the text of that file with
Javascript.
Details
-------
Of course, I zoomed straight away to document.getElementById('myId')
expecting to find the text as a child of the 'object' element. I found
the 'object' element, but its one-and-only child turned out to contain
merely myDefaultText.
I've also searched through the various window 'get' functions -- for
example, window.getComputedStyle(document.getElementById('myId'),'') --
with no luck. I've even used the nodal interfaces, attributes.item(i),
and have totally failed to find the file text.
In desperation, I've browsed the entire document tree, firstChild by
nextChild and nextSibling by nextSibling, and can't find the file text
anywhere. It appears that it is *not* part of the document tree, nor is
it a child of window.
I've even suspected that the file text may be getting stuck into a
:before pseudo-element or an :after pseudo-element, but I don't know how
to access pseudo-elements with Javascript.
Can anyone help me? I've been at this for 2 weeks and am at my wit's end.
Best Regards - Mark Filipak
In M$IE, you can get access to the code of the URL "myURI" by:
str=document.getElementById("myId").object.body.innerHTML; 
alert(str);
In NS6+/Mozilla, you must first create an Object reference:
insert the following code in the file myURI:
if (!document.all) parent.sendObjRef(this.document); 
the file containing the object-tag must contain the following javascript
code:
        var myObj1
function sendObjRef(obj1)
        {
        myObj1=obj1;
        }
then you can get access to the code of myURL by:
alert(myObj1.body.innerHTML);
In a similar way you can get access to any HTML-element in the file myURL.
Best Regards - Klaus
Hello Mark!
I've tried to answer on your mail (2x) however I've got mail delivery
errors, so I try to contact you on this way.
In the example file, you send me were some minor errors as misplaced
divs (in the head) and you didn't use exactly the syntax as shown above. 
Despite from these errors, it isn't possible to get access to the HTML
inside the object before the page is completly loaded, thus the
javascript-alert must be called via a function.
Below the re-written example file and the changes added to the object file:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
        <meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>Test Klaus's Idea</title>
<script type="text/javascript" src="domBrowse()_.js" ></script>
<script type="text/javascript">
        var myObj1, myObj2;
function sendObjRef(obj1, obj2)
        {
        myObj1=obj1;
        myObj2=obj2;
        }
function show()
        {
        if (!document.all) alert(myObj2.body.innerHTML);
        else alert(document.getElementById("o3").object.body.innerHTML);
        }
</script>
</head>
<body>
<div class="inhalt" id="inhalt">
<div style='position:relative;visibility:visible;top:0px;left:0px;'>
<input type="button" value="DOM Browser" onclick="domBrowse('window');">
</div>
<object id="o1" style='border:2px solid red;' data='testTextObject_.txt'
type='text/plain'></object>
<object id="o2" style='border:2px solid green;'
data='testTextObject_.txt' type='text/plain'></object>
<object id="o3" style="border:2px solid blue;"
data="testHtmlObject_.htm" type="text/html"></object>
<br /><br />
<a href="javascript:show();">Show the content of the object (id="o3")</a>
</div>
</body>
</html>
and the object file: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv = "Content-Type" content = "text/html; charset =
ISO-8859-1" />
<title>CSS2 UI Metrics</title>
<script src='domBrowse()_.js'></script>
<script type="text/javascript">
if (!document.all) parent.sendObjRef(window, this.document);
</script>
</head>
<body>
<div style='position:relative;visibility:visible;top:0px;left:0px;'>
<input type="button" value="DOM Browser" onclick="domBrowse('window',1);" />
</div>
<table id='CSS2UiMetrics'><tr><td>
<table>
<tr style='font-family:monospace;'>
..........
In addition their is still an error in your domBrowse() function leading
in Mozilla (Gecko version 20020826) to the following Error: uncaught
exception: Permission denied to get property Window.fullScreen
Please send me an e-mail address where I can contact you for further
discussions.
Best regards 
Klaus