I want to get body element ‘tinymce’ which positioned inside iframes as the tree shown below..
html -> body -> div#wpwrap -> div#wpcontent -> div#wp-content -> div#wrap -> form#post -> div#editorcondainer -> div#poststuff -> div#post-body -> div#post-body-content -> div#postdivrich -> div#editiorcontainer -> span#content_parent -> table#content_tbl.mceLayout -> tbody -> tr -> td.mceIframeContainer.mceFirst.mceLast -> iframe#content_ifr -> html -> body#tinymce.mceContentBody
For that i uses the code :
var iframeEl = document.getElementById('content_ifr');
alert(iframeEl);
if ( iframeEl.contentDocument ) { // DOM
var bdy = iframeEl.contentDocument.getElementById('tinymce');
} else if ( iframeEl.contentWindow ) { // IE win
var bdy = iframeEl.contentWindow.document.getElementById('tinymce');
}
But iframeE1 is null 🙁
Im trying other ids in the tree but it stop returning elements from the ‘span id :content_parent’, the last id returning object is ‘div id :editorcontainer’
How could i get the elements after ‘span id :content_parent’
Try
document.getElementById('content_ifr');The code above looks fordocument.getElementById(undef);(since you never define a variable calledcontent_ifr).If the source of the
iframeis not in the same domain as the the containing page, you will not have access to the iframe’s contents, as they’re in differing security sandboxes.The
<iframe>creates a new window context with a new document. So give the<iframe>a name attribute likename="somename"so you can access it like this:If you don’t have access to the HTML you could first add the name via JS like this:
Some digging on SO brought up this: accessing a form that is in an iframe which explains how to do this with only an ID. That should sum up the possibilities.