0

I have an iframe that I run code inside. I don't know the iframes ID as it's set by another application. I wish to change the page in the iframe to another url. How can I do this without knowing the id?

sample html: http://plnkr.co/edit/kE9WdSTWe4GdDKPbFboV?p=catalogue

Himmators
  • 14,278
  • 36
  • 132
  • 223
  • `document.getElementsByTagName('iframe')` should do – phylax Apr 30 '14 at 16:12
  • 1
    the method commented by phylax is only aplicable if you have a single iframe only, can you put your code in jsfiddle? – xzegga Apr 30 '14 at 16:13
  • what code? I', running a facebook-tab-app, I could select the iframe in some various ways, but it's hard to be sure it won't change, thus breaking the app. – Himmators Apr 30 '14 at 16:16
  • @KristofferNolgren It would be good to share your rendered HTML, can you share ? – vikas Apr 30 '14 at 16:20

2 Answers2

2

If you have a single iframe, do this:

document.getElementsByTagName('iframe')[0].src = "url"

getElementsByTagName returns NodeList, on which you can use index to use the specific element from the list.

Index start at 0

Amit Joki
  • 58,320
  • 7
  • 77
  • 95
2

If you know the URL that you want to replace you can do this : 

var frames = document.getElementsByTagName("iframe");
for (var i = frames.length - 1; i >= 0; i--)
{
  if(frames[i].src == "currentURL"){
     frames[i].src = "newURL"
  }
}

Or If you are the page inside the iframe you can simply redirect the page :

window.location.replace("http://www.newlocation.com")
Adjit
  • 10,134
  • 12
  • 53
  • 98
  • But when I think about it, will this really work to run inside the iframe, does my iframe know what's outside it, including itself? – Himmators Apr 30 '14 at 16:25
  • @KristofferNolgren what exactly is the context of the script? are you trying to put this script in a page that will be called by an iframe and then you want to change the source of the iframe? or will this be in your page that contains the iframe? – Adjit Apr 30 '14 at 16:28
  • the first, inside a page that will be called by an iframe. – Himmators Apr 30 '14 at 16:28
  • @KristofferNolgren let me know if this works, but I don't think it will. I'm going to look into it, but I think it can be done. – Adjit Apr 30 '14 at 16:30
  • For some reason my array isn't looping. I do get an array of frames0: iframe#fb_xdm_frame_https 1: iframe 2: iframe#vimeo 3: iframe 4: iframe 5: iframe f2df062044: iframe f3cc14cccc: iframe f266b0cb9c: iframe fb_xdm_frame_https: iframe#fb_xdm_frame_https fbd403e2c: iframe – Himmators Apr 30 '14 at 16:36
  • @KristofferNolgren it is looping, but it's getting the iframes from the page with the loop. I don't know what that is you posted – Adjit Apr 30 '14 at 16:39
  • @KristofferNolgren after some digging, the only way what you want to do is possible, is if both the iFrame and the parent document come from the same host. More info here : http://stackoverflow.com/questions/5604839/accessing-an-element-outside-of-iframe – Adjit Apr 30 '14 at 16:50
  • one solution I have concidered that is dirty is to fake a click on a link inside the dom of the iframe. – Himmators Apr 30 '14 at 16:51
  • 1
    @KristofferNolgren you don't even need to do that actually... here is what you can do : `window.location.replace("http://www.newlocation.com")` – Adjit Apr 30 '14 at 17:22
  • great, if you write an answer with that solution i'll give you the credit! – Himmators Apr 30 '14 at 18:36