1

I have a local webpage (on my file system). I wish to load an iframe on the page that displays domain.com. I wish to change the iframe contents.

I can get access to domain.com and can get them to host a javascript file for me. So this should mean I do not run into the issue of same origin. It take ages for my file to get uploaded as it is done by a different team etc. My idea was on the server domain.com in my js file I could call another js file on myserver.com. Is it is being included in the domain.com js file it should work... well it doesn't.

Is this possible?

domain.com js file is as follows:

$(document).ready(function(){
    $.getScript("http://www.myserver.com/my.js");
});

my.js on my server is doing

alert($("iframeID").contents().find('body').html());

It is returning null

If in my.js I do

alert('test');

Test is alerted to me.

2 Answers 2

2

The Same Origin Policy applies to the page sources, not the JavaScript. If your page is from one place (a file:// URL) and the other page is from another domain, then it doesn't matter where your script is hosted.

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

6 Comments

So if I put the content of my.js in the domain server file it would work OK?
No. It does not matter where the JavaScript files are hosted. All that matters are the URLs of the actual pages, the outer "main" page and the page in the <iframe>. If the domains are not the same, then neither page cannot do anything to the other.
Instead of calling your script with jquery just have them include it like any other js file. <script src="me.com/myscript.js" />. What is the point of calling it with jquery?
@mrtsherman - for one $.getScript() loads the scripts only after the DOM is loaded, so downloading the script doesn't affect the page load time negatively.
Yes - if your page and the other page are both from the same domain, then JavaScript on both pages can run amok with each other's DOM :-)
|
1

I'm not sure I got your scenario 100%. Correct me if I'm wrong:

  1. You have a page with an iframe, and the iframe points to a page at domain.com
  2. The page at domain.com attempts to retrieve your script from myserver.com, using $.getScript()
  3. The script, when loaded, needs to modify the DOM on the page in domain.com (the one in the iframe)
  4. The element iframeID in your code sample alert($("iframeID")... refers to the iframe on your page, where the page from domain.com is displayed

If this is correct, the issue is that the javascript executing inside the iframe on domain.com knows nothing about the iframe. It doesn't even know it is in the iframe. You can manipulate the page like any other HTML document, because the script is executing within the page in domain.com -- it doesn't matter where the script originally came from.

So you can print the body of the page in domain.com very simply:

alert($(body).html())

3 Comments

nearly point 2 the page that is in the iframe does not reference the the js file. I do have a js file on the server that is doing the getScript
this being the case alert($(body).html()) returns the html for the iframe container and not the contents inside that I need to edit.
@Sally - ah, so you're loading the script hosted in domain.com to your page in other domain, which contains the iframe? Sorry, that won't work. It doesn't matter where the scripts come from, it matters where they execute. In order to give your scripts access to the document inside the iframe, the scripts need to execute inside the iframe

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.