471,321 Members | 1,744 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,321 software developers and data experts.

Get contents of HTML page in iframe, into Javascript variable

I have a page with an iframe, and a Javascript function that I need to get the contents of the iframe - what I mean by that is, the text from the list.html file that's in the iframe. It's actually a list of numbers (no formatting) but I'm happy to take it as a text string and go from there... it could be a .txt file but I heard at one point that .html would work better. Trouble is, I can't work out how to access the contents of the iframe from the script. Here's what I have. I'm trying to keep it as simple as possible so I can build around it when I get it working.
Expand|Select|Wrap|Line Numbers
  1. <html>
  2.  
  3. <head>
  4. <script language="JavaScript">
  5. function getList() {
  6.     var list = document.getElementById('myFrame').innerHtml;
  7.     alert(list);
  8. }
  9. </script>
  10. </head>
  11.  
  12. <body>
  13. <iframe name="myFrame" id="myFrame" src="list.html"><iframe>
  14. <a href="javascript:getList()">Get List</a>
  15. </body>
  16.  
  17. </html>
  18.  
I'm really clueless here - it's the first time I've tried to do any input in Javascript other than forms. I have done extensive googling and experimented by myself, but everything I try gets me either no alert at all, or an alert that just reads "undefined". I've tried 'getElementById', 'window.frames("myFrame")', every combination of document.body and window.document.body imaginable... is there something obvious I'm missing?
Jul 26 '07 #1
1 11294
Parent HTML
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2.  
  3. <html>
  4. <head>
  5.     <title>Untitled</title>
  6. </head>
  7.  
  8. <style>
  9. iframe {height:200px; width:300px; border:1px solid #000}
  10. </style>
  11.  
  12. <script>
  13. function iframeContent() {
  14. frame = document.getElementById("myFrame")
  15.  
  16.     if (frame.contentDocument) {
  17.     alert(frame.contentDocument.getElementById("test").innerHTML)
  18.     }
  19.     else if (frame.contentWindow) {
  20.     alert(frame.contentWindow.document.getElementById("test").innerHTML)
  21.     }
  22. }
  23. </script>
  24.  
  25. <body>
  26.  
  27. <iframe src="document.html" id="myFrame">
  28. </iframe><br>
  29.  
  30. <button onclick="iframeContent()">OK</button>
  31.  
  32. </body>
  33. </html>
  34.  
IFRAME
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2.  
  3. <html>
  4. <head>
  5.     <title>Untitled</title>
  6. </head>
  7.  
  8. <body>
  9.  
  10. <p id="test">Text</p>
  11.  
  12. </body>
  13. </html>
  14.  
Just an example showing how you can acess elements within an iframe!
Good luck!

ps: working on ie7 now
Jul 27 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

3 posts views Thread by John Chen | last post: by
1 post views Thread by syshex | last post: by
2 posts views Thread by bs9999 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.