0

How can I store the elements of an iframe into a variable?

This is something I want to happen within the parent.

I know the elements should have an id to implement this repeatedly proposed solution that does not work:

var foo = document.getElementbyId([IFRAME ID]).contentWindow.document.getElementbyID([ELEMENT ID]);

nor does this code work:

var foo = document.getElementbyId([IFRAME ID]).contentDocument.getElementbyID([ELEMENT ID]);

Saving each section into individual variables makes no difference.

i.e.

var x = document.getElementbyId([IFRAME ID]);
var y = (x.contentDocument || x.contentWindow.document);
var foo = y.getElementbyID([ELEMENT ID]);

What works? Please demonstrate a solution in jfiddle.

Thanks.

UPDATE:

I tried running this function with the iframe id passed into it (on my site there is a jukebox page which is loaded into the main iFrame and it has an iFrame itself -- which has an id called 'albumcover'):

  function showIframeContent(id) {
   var iframe = document.getElementById(id);
   try {
   var doc = (iframe.contentDocument)? iframe.contentDocument: iframe.contentWindow.document;
   alert("The jukebox page's iframe URL is" +   
   doc.getElementById('albumcover').contentWindow.location.href);
}
catch(e) {
   alert(e.message);
}
    return false;
 }

I then received this message:

[ Permission denied to access property "href" ]

-- 100% of my site, all referenced data...everything, is within a public_html folder...same domain, same hosting service area...the works.

What in the world is going on?

Thanks again.

miasweb
  • 23
  • 6
  • check this: http://stackoverflow.com/questions/1088544/javascript-get-element-from-within-an-iframe – aless80 Apr 14 '16 at 15:05
  • I tried those already. Done it all my friend -- from posts here and seemingly everywhere else. I tried the different variable storage code: "var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;" *and* the parent call of a iframe page function try: "function getElementWithinIframe() { return document.getElementById('copy-sheet-form'); } Then you call that function like so to retrieve the element: var el = document.getElementById("iframeId").contentWindow.functionNameToCall();" – miasweb Apr 14 '16 at 15:11
  • Now that I rethink about this, it is not always possible to access the content of the iframe for security reasons. In fact, the link I sent you says: "IMPORTANT: Make sure that the iframe is on the same domain, otherwise you can't get access to its internals. That would be cross-site scripting." – aless80 Apr 14 '16 at 15:28
  • Do you get any error when you try the implementation above? – aless80 Apr 14 '16 at 15:34
  • I read that too earlier this week -- the actual page in the iframe that is loaded is in the exact same directory as the parent page (index.html). No issues what that. I imagine that some functionality was retired by these browser developers. – miasweb Apr 14 '16 at 15:48
  • There are many implementations above. :) -- None of the "solutions" I referenced threw any errors. Thanks for returning and helping. – miasweb Apr 14 '16 at 15:51
  • Are you letting the iframe load before trying to access it's elements? – thykka Apr 14 '16 at 17:08
  • Like so: https://gist.github.com/thykka/5387fc9a8b168b5c21afa7af4b62997e – thykka Apr 14 '16 at 17:16
  • You accidentally input 'herp' instead of 'derp' at the end of that 'gist'... – miasweb Apr 14 '16 at 17:25
  • It is not a mistake. #herp is an element in index.html, #derp is an element in iframe.html. – thykka Apr 14 '16 at 18:19
  • I was on my way out the door to an appointment and skimmed it, I just knew that iframe.html had an iframe that I assumed you were trying to target and saw that you stored "MyIFrame" and thought you were going for it's 'derp' element -- btw Full screen mode is triggered when the iframe component calls a function through its onLoad feature...so the page loads. Is this a solution independent of that concern or is a way to make sure that the page loads and then do semantically equivalent things that have been tried to see if they would work now. Who cares, I'll try it out soon. – miasweb Apr 14 '16 at 19:46

0 Answers0