21

I am doing this first time. I have created an iframe on my page and I want the text from the iframe through jquery. Here is my code :

<html> <head><script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript"> function copyIframeContent(iframe){ var iframeContent = $(iframe).contents(); //alert(iframeContent); //$("#result").text("Hello World"); $("#result").html(iframeContent.find('body').html);alert(iframeContent.find('body').html()); } </script> </head> <body> <iframe id="myIframe" onload="copyIframeContent(this);" name="myIframe" src="text.php"></iframe><br /> Result:<br /> <textarea id='result'></textarea> <input type="button" value="click" id="btn" onclick="aa()"> <script type="text/javascript"> function aa(){ alert("Fdf"); alert(document.getElementById('myIframe').contentWindow.document.body.innerHTML); } </script> </body> </html>

text.php:

text to change

I tried a lot in all browsers but still this is not working. Can anyone help me to get this content?

Improve this question
8
  • yes its a same page and in same directory Commented May 16, 2013 at 13:54
  • 2
    " but still not working" Im just wondering what that means? Please elaborate by giving us error message if any Commented May 16, 2013 at 13:54
  • i have copy/paste here my wholde code but still its now working dontknow why. in alert it shows me [ObectObject] Commented May 16, 2013 at 13:55
  • 1
    Don't use alert, use console.log() and check object Commented May 16, 2013 at 13:56
  • it shows me this error " Permission denied to access property 'document'" in console Commented May 16, 2013 at 13:58

4 Answers 4

Reset to default
5

The contentWindow works in both FF and chrome

document.getElementById('myFrame').contentWindow.document.body

Would give you a DOM element body

You can also try something like

 window.frames['myIframe'].document.body

That might do the trick for you also

You might have problems with your browsers built in security. If you run this on a local machine. There is a way to disable browsers security.

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

first i watn the text from the text from the iframe and then i want to replace it with my div(result)
(document.getElementById('myFrame').contentWindow.document.body).appendchild(div(result)) w3schools.com/dom/met_element_appendchild.asp
3

Use .contents() to get to iFrame's DOM.

$('#myIframe').contents()

UPDATE:

In the OP:

$("#result").html(iframeContent.find('body').html);

Should say:

$("#result").html(iframeContent.find('body').html());
Improve this answer

3 Comments

its now working.. i alert this and i get "[obect Object]" in the alert box
$('#myIframe').contents().find('body').html() too? .contents() alone returns jQuery.
"not working" is not enough description, I'm afraid. Have you tried to console.log this instead of alert? Then you'll be able to actually see inside the Object returned and see what's what. Btw. no security errors in the console?
3 
var content=$("iframe").contents().find('body').html(); alert(content);
Improve this answer

1 Comment

Hiya, this may well solve the problem... but it'd be good if you could edit your answer and provide a little explanation about how and why it works :) Don't forget - there are heaps of newbies on Stack overflow, and they could learn a thing or two from your expertise - what's obvious to you might not be so to them.
1

Doing with jquery will be a little easier:

$('Your Selector', frames['myIframe'].document)

The above example will get anything from myIframe. But the iframe MUST be from the same domain as the parent document. If not from the same domain, a security violation occurs (You can't add content from foreign sites to your page and change that content.)

If no security violation, you can do anything with the selection. For example you can use the jquery append() method to insert new html inside the iFrame, you can use the html() method to replace html or any other function that jquery/pure javascript allows.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.