How to get the body s content of an iframe in Javascript

Question

lt iframe id  id description iframe  class  rte-zone  height  200  frameborder  0  title  description  gt     lt html gt       lt head gt  lt  head gt       lt body class  frameBody  gt        test lt br  gt       lt  body gt     lt  html gt   lt  iframe gt    What I want to get is   test lt br  gt

User · Answer

I think placing text inbetween the tags is reserved for browsers that cant handle iframes i.e...

<iframe src ="html_intro.asp" width="100%" height="300">
  <p>Your browser does not support iframes.</p>
</iframe>

You use the 'src' attribute to set the source of the iframes html...

Hope that helps :)

User · Answer

AFAIK  an Iframe cannot be used that way  You need to point its src attribute to another page   Here s how to get its body content using plane old javascript  This works with both IE and Firefox   function getFrameContents       var iFrame    document getElementById  id description iframe       var iFrameBody     if   iFrame contentDocument            FF      iFrameBody   iFrame contentDocument getElementsByTagName  body   0           else if   iFrame contentWindow            IE      iFrameBody   iFrame contentWindow document getElementsByTagName  body   0            alert iFrameBody innerHTML

User · Answer

Using JQuery  try this       id description iframe   contents   find  body   html

User · Answer

To get body content from javascript  i have tried the following code   var frameObj   document getElementById  id description iframe     var frameContent   frameObj contentWindow document body innerHTML    where  id description iframe  is your iframe s id  This code is working fine for me

User · Answer

The following code is cross-browser compliant  It works in IE7  IE8  Fx 3  Safari  and Chrome  so no need to handle cross-browser issues  Did not test in IE6    lt iframe id  iframeId  name  iframeId  gt     lt  iframe gt    lt script type  text javascript  gt      var iframeDoc      if  window frames  amp  amp  window frames iframeId  amp  amp           iframeDoc   window frames iframeId document             var iframeBody   iframeDoc body          var ifromContent   iframeBody innerHTML         lt  script gt

User · Answer

The exact question is how to do it with pure JavaScript not with jQuery   But I always use the solution that can be found in jQuery s source code  It s just one line of native JavaScript   For me it s the best  easy readable and even afaik the shortest way to get the iframes content   First get your iframe  var iframe   document getElementById  id description iframe        or var iframe   document querySelector   id description iframe      And then use jQuery s solution  var iframeDocument   iframe contentDocument    iframe contentWindow document       It works even in the Internet Explorer which does this trick during the contentWindow property of the iframe object  Most other browsers uses the contentDocument property and that is the reason why we proof this property first in this OR condition  If it is not set try contentWindow document    Select elements in iframe  Then you can usually use getElementById   or even querySelectorAll   to select the DOM-Element from the iframeDocument   if   iframeDocument        throw  iframe couldn t be found in DOM       var iframeContent   iframeDocument getElementById  frameBody        or var iframeContent   iframeDocument querySelectorAll   frameBody      Call functions in the iframe  Get just the window element from iframe to call some global functions  variables or whole libraries  e g  jQuery    var iframeWindow   iframe contentWindow      you can even call jQuery or other frameworks    if it is loaded inside the iframe iframeContent   iframeWindow jQuery   frameBody        or iframeContent   iframeWindow     frameBody        or even use any other global variable iframeWindow myVar   window myVar      or call a global function var myVar   iframeWindow myFunction param1                Note  All this is possible if you observe the same-origin policy

User · Answer

use content in iframe with JS   document getElementById  id iframe   contentWindow document write  content

User · Answer

Chalkey is correct  you need to use the src attribute to specify the page to be contained in the iframe  Providing you do this  and the document in the iframe is in the same domain as the parent document  you can use this   var e   document getElementById  id description iframe    if e    null       alert e contentWindow document body innerHTML       Obviously you can then do something useful with the contents instead of just putting them in an alert

User · Answer

it works perfectly for me     document getElementById  iframe id   contentWindow document body innerHTML

[javascript] How to get the body's content of an iframe in Javascript?

Examples related to javascript

Examples related to html

Examples related to iframe