CODEWITHSUNDEEP
javascript
tonyf
tonyf

Reputation: 35557

How to access item values nested within the DOM?

I need to access a value within a form and an iframe from the parent form that is nested 3 and 4 levels deep.

Basically, the tree hierarchy (DOM) seems to be as follows:

<form name="formname" ....>
   <iframe id="refframe">
     <form name="formname" ...>              ==> Level 3
       <iframe id="iframe1">                 ==> Level 4

Now I have a item value at Level 3 (say myValue), that I would like to access from the top level (parent - Level 1)

With JavaScript, how could I access this item "myValue" from the parent top level?

The same goes with accessing an item at Level 4, within the iframe id of iframe1

Based on the above as I still am not sure how to access information but if I have the following HTML code:

<div class="tabs0">
<iframe id="refframe" width="1210px" height="584px" frameborder="0" align="left"

overflow="auto" src="http://www.example.com" home="" name="Site1">
</iframe>

</div>

<div class="tabs1">
<iframe id="refframe" width="1210px" height="584px" frameborder="0" align="left" overflow="auto" src="http://www.def.com" name="Site2">

How can I access the src value within tabs1 class iframe from the parent window, i.e.

src="http://www.def.com"

Upvotes: 1

Views: 264

Answers (3)

meder omuraliev
meder omuraliev

Reputation: 186572

<form name="formname" .... id="form-first">
    <iframe id="one" src="iframe2.html">
    </iframe>
</form>


function iframeRef( frameRef ) {
    return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument
}

var inside = iframeRef( document.getElementById('one') )

var secondIframe = inside.getElementsByTagName('iframe')
alert( secondIframe.id ) // make sure theres an iframe with an id in the iframe2.html.

You can use iframeRef to grab the reference inside of the iframe, and just do keep doing that to get to child iframes. This should work for IE.

Upvotes: 1

TM.
TM.

Reputation: 111047

Is the content in the iframe loaded from the same domain as the parent document? If not, then due to browser security restrictions (same domain policy), you won't be able to access it via javascript.

If it is from the same domain, you should be able to use getElementById without any problems.

Upvotes: 3

Alex Martelli
Alex Martelli

Reputation: 881775

Just use id as a unique value (as it should be -- see e.g. here, section 7.5.2) -- then, GetElementById does just what you want, without requiring you to navigate any complex hierarchies.

Upvotes: 1

Related Questions