How jquery or javascript access DOM in iframe? - javascript

I want jquery or javascript to access DOM in Iframe.
For example, I make a iframe to show amazon.
then I wanna get a banner image link on amazon.
Can I do this?
and I have one more problem.
if I click amazon banner that is made a by _blank target on "a" Tag in a iframe,
browser make a new tab. but I wanna see a new page in a iframe.

You cannot do that if the origin of the iframe is different from the parent document :
https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

Related

how to click a link inside iframe

I want to click on a link inside iframe onload with the help of JavaScript, I have a site loading inside an iframe, now I want to click a link of a particular div (ID) on page load. The link is inside the iframe.
Actually I'm trying to change the language of the website which is loading in the iframe, the site has gtranslate plugin installed and has different language flag at the footer of the site.
Basically is it possible to force a page to be translated when the page loads?
The Same Origin Policy prevents you from scripting an Iframe from a different domain.
Possible answer here

Insert data into an iframe in wordpress

I have a question about changing output of iframe. My site loads a front page (wordpress) where the entire content block is an iframe. Can I manipulate the output of the iframe from the wordpress side?
Say I want to scroll to an id tag in the content of the iframe, can I create a link on the frontpage outside the iframe that goes there?
Another example could be to pre-fill an input field in the iframe by clicking a menu link in wordpress, is it at all possible?
It can depend on whether the iframe is cross-origin or not (i.e. whether the src attribute on the iframe is on the same domain as your wordpress site).
If it isn't - then you can simply access the iframe contents using javascript from the parent window, e.g. (in the parent window):
const iframe = document.getElementById('<your-iframe-id>');
const iframeDoc = iframe.documentElement || iframe.contentWindow.document;
doThingsWithIframeContents(iframeDoc);
If it is cross-origin - then you will need to pass messages to a script you control inside the iframe document. That script will then manipulate the contents of the iframe itself. Without going into too much detail, take a look at https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage.
Edit: Actually, take a look at this other SO post that is relevant to this case: How to communicate between iframe and the parent site?
Hope that helps!

new window/tab event from an <iframe>

I have an iframe in my website which its content is dynamic and I can't control it.
Is it possible to detect a new-window/tab opened from this iframe using Javascript?
Thanks!
You could do this, but in some weird way :)
If you can edit html on the server where iframe source loads from, place there another iframe (style="width:0px;height:0px;display:none") with src="http://your site/control page".
This trick will give you DOMdocument control by js on the both side of iframe.

Open links from an external website that sits in an Iframe in a new window

I have a website with an iframe on one page that goes to an external URL (which I have no control over). I am trying to find a way to have all the links in the Iframe (not the entire page) open in a new window. I've tried a couple solutions with no luck. Is there a way I can target the iframe and use the HTML base tag?
Due to the Same Origin Policy, you can only modify the contents of an iframe if the domains and protocols match.

Listening from a iframe event

On my page (index.htm) i have a iframe inside a modal that loads a content i.e (pagex.htm) from a different domain (not owned by me).
This iframe with (pagex.htm) has a element with id (#close) that also have a onclick() event as below:
<a id="close-lite" class="ch-close" onclick="closeRender();" href="#">×</a>
In my index.htm i have my jquery/javascript and what im trying to do is to access the iframe and get the click event to close the modal that is inside my page (so im not trying to modify the iframe content). I have tried to use .content() but without sucess yet.
Perhaps is a cross domain policy ussue? how can i get around this?
How can i do this with javascript/jquery ?
The same-origin-policy prevents you from listening to what is going on in the Iframe.
Can be used postMessage().
http://robertnyman.com/2010/03/18/postmessage-in-html5-to-send-messages-between-windows-and-iframes/
But it works not in all browsers and needs init from both sides.

Categories

Resources