CODEWITHSUNDEEP
javascriptjqueryhtml
deck john
deck john

Reputation: 647

Get data from iframe

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?

Upvotes: 21

Views: 82030

Answers (4)

Higarian
Higarian

Reputation: 593

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.

Upvotes: 1

Sudhakar Singajogi
Sudhakar Singajogi

Reputation: 58

var content=$("iframe").contents().find('body').html();

alert(content);

Upvotes: 3

John b
John b

Reputation: 1398

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.

Upvotes: 5

Petr Vostrel
Petr Vostrel

Reputation: 2332

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());

Upvotes: 3

Related Questions