1

I'm trying to change the element in one frames html with controls contained inside another frame. I can't however get it right to achieve this.

I basically have this:

<a href = "#"  id = "c1" onclick = "document.getElementById('text').color =     'red'">red</a>

which is meant to change this.

<p id = "text">dsdsdsdsd</p>

I can't however figure out how to do this the right way.

Edit:

The main page for this looks as follows:

<frameset cols = "15%, *" frameborder="100" border="1" framespacing="1">
<frame src ="bookMenu.html" scrolling = "no"/>
<frameset rows = "*, 10%" frameborder="100" border="1" framespacing="1">
    <frame src ="book1_intro.html" scrolling= "yes" name = "main"/>
    <frame src ="book_controls.html" scrolling= "no" name = "control"/>
</frameset>

The Calling button is in the framed named control and the destination is in the frame named main

Crossman
  • 278
  • 5
  • 18

2 Answers2

1

You need to get a reference to the parent first, then a reference to the frame that contains your paragraph tag and use contentDocument to get at the document within that frame.

See:

How to access parent Iframe from javascript

How can I access iframe elements with Javascript?

Community
  • 1
  • 1
magritte
  • 7,396
  • 10
  • 59
  • 79
  • Do you mean something like this: onclick = "parent.main.currentDocument.getElementById('text').style.color = 'red' – Crossman Mar 03 '13 at 18:37
  • `document.querySelector('[name=authFormiFrame]').contentDocument.getElementById('userName')` – Ray Foss Apr 10 '20 at 01:04
1

If you really have frames, set a name attribute for the frame elements in frameset(s). Then you can refer to the #text from any frame (or frameset document) like this:

var text = top.window.main.document.getElementById('text');

Notice, that if this is a local page, you can't refer (i)frames, when using Chrome. However, there's a workaround for this: add --allow-file-access-from-files to the target path of the Chrome icon, and open Chrome by clicking this modified icon before opening the frameset file.

Teemu
  • 22,918
  • 7
  • 53
  • 106
  • at the moment I have this: top.window.main.document.getElementById('text').style.color for linking down into a nested frameset, should I be using parent then ? cause it doesn't seem to want to work either way – Crossman Mar 03 '13 at 19:19
  • @Crossman `top.window` should work here, providing `book_controls.html` is not a `frameset` page too. Please make sure you've unique values in `id`s, and that `#text` exists. Also prefer using real closing tags for ``s, frames and framesets are not a part of HTML5. – Teemu Mar 03 '13 at 19:34
  • @Crossman "`#text exists`" in my previous comment includes also situations, when `main` maybe not loaded or `#text` is not appended yet. – Teemu Mar 03 '13 at 20:00