I have a <div>
being dynamically created, and it contains an <iframe>
. The <iframe>
may close itself, at which point the <div>
is removed.
So far I have:
var div = document.createElement('div'), ifr = document.createElement('iframe');
// some styles and stuff here, including ifr.src
ifr.contentWindow.container = div; // Note that domains are the same
// within the iframe's code, possibly a "close" link or after completing an operation
container.parentNode.removeChild(container);
It works. But only if the page within the iframe is the one that was there to start with. If a link is clicked to another page, window.container
is no longer defined.
I know I can use window.name
to store data persistent to a window, but that it limited to data that can be serialised. To my knowledge, you can't serialise a DOM node, other than by assigning it an ID and storing that. I would like to avoid such arbitrary IDs, so if anyone can suggest a better solution I would be very grateful.
Use this code:
//At the frame:
var parentFrames = parent.document.getElementsByTagName("iframe");
for(var i=parentFrames.length-1; i>=0; i--){
if(parentFrames[i].contentWindow == window) {
parentFrames[i].parentNode.removeChild(parentFrames[i]); //Removes frame
//Add an extra `.parent` at each side of the expression to remove the `div`.
break;
}
}