Change, add, remove content to iframe that contains other domain

Asked Mar 30 '15 at 23:42

Active Mar 31 '15 at 00:00

Viewed 397 times

I have an iframe that looks like this:

<iframe id="feed" width="100%" height="100%" frameborder="0" src="http://foo.com/bar"></iframe>

I want to change styles, remove and add elements to the iframe

I tried using this:

function iframeRef(frameRef) {
            return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument
}
var inside = iframeRef(document.getElementById('feed'));
var elem = inside.createElement('p');
elem.style.zIndex = '2';
elem.style.position = 'absolute';
elem.innerHTML = 'TEXT';
inside.body.appendChild(elem);

But it doesn't work, how can I manipulate the DOM from the iframe?

edited Mar 31 '15 at 00:00

Mathemats

1,185
4
22
35

asked Mar 30 '15 at 23:42

Daniel Nadasan

You can't change the DOM of other domains for security reasons. – Victory Mar 30 '15 at 23:44
There is no (simple) way to do this. Take a look here: http://stackoverflow.com/a/364997/983914 – oleynikd Mar 30 '15 at 23:45
Isn't there a way to copy the DOM from that domain and change the copy? – Daniel Nadasan Mar 30 '15 at 23:46
JavaScript won't let you access the source of the page in the iFrame, so you can't copy it in order to edit the copy. – Benjamin Ray Mar 30 '15 at 23:53
CORS access will have to be allowed on the `contentDocument` page. – StackSlave Mar 30 '15 at 23:54

Change, add, remove content to iframe that contains other domain

0 Answers0