Why does .contents() not work?
How to get an element inside an iframe as in the jQuery API example
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>contents demo</title>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<iframe src="//api.jquery.com/" width="80%" height="600" id="frameDemo"></iframe>
<script>
$( "#frameDemo" ).contents().find( "a" ).css( "background-color", "#BADA55" );
</script>
</body>
</html>
As previously stated, you can not access content from a frame or iframe from another domain via Javascript for security reasons.
The example you put in Plunker did not work because the domain where the code runs is run.plnkr.co , with the iframe URL being plnkr.co . That is, even subdomains are considered different domains.
I made a functional fork of your Plunker by creating an HTML in the same directory, or iframe .
Note also that I used the load() event to wait for page load iframe .
In fact, it is not possible to work the content of an iframe that is in a different domain than the page that rendered it. However, to solve this messaging problem, there is the jquery-postmessage-plugin ( link ), depending on of its necessity it can be used.
He is quoted in several examples on the internet to solve problems of the kind you cited.
You can even perform a message exchange between the parent page and the iframe. However, for this you need to have access to the iframe source code. If you have this access, I have some examples that can help you (I had to do this several times). If you do not have it, for security reasons you really will not be able to.
You can only manipulate iframes that are in the same domain, or by changing the iframe headers by the server.
You can not fetch data from external domains using jquery. Try PHP's library curl .
You can handle it this way:
jQuery(“.iframeMain”, window.parent.document)
check out the site with example
Access to iframes and frames is only possible when the entire domain is the same (this includes subdomain and port). If one of these is different your browser will ignore any access to the target's DOM, considering a security flaw.
You can communicate using window.postMessage described in HTML5, but older browsers do not support such a feature.
You can read more at link that also contains a reference for browsers that support the feature and its limitations.
One note about your code is that it may also be running before the DOM of your iframe is rendered. The iframe has asynchronous loading compared to the window it is in, so to make sure the element exists in your frame, wait for the event load of iframe to search the DOM. (remembering that domains have to be identical)