As I mentioned at the end of the last video, we can allow communication between a parent frame and
a child frame, depending upon some settings that we apply to the iFrame element.
So let me show you another quick diagram again.
Right now, we have some JavaScript running in the parent frame and some running inside the child frame.
The current settings of our iFrame allow communication between these two different context.
So just because the current settings we have, we can very easily and directly communicate between these
two context.
But if we change these settings, this communication link can be completely broken and we can isolate
the iFrame from the parent.
So let's first take a look at how everything works with our current settings, which are going to allow
communication.
All right, so back inside my console, I have once again selected top.
I'm then going to declare window A equals one once again.
Well, then change into test HTML now, just as a quick reminder, if I do window A, I get undefined
because this iFrame element has a different JavaScript execution context.
So I don't when I reference window, I'm referencing window inside of the iFrame rather than the index
html file.
But if I wanted to reference the parent, if I wanted to write some javascript inside of the child and
somehow get access to the parent, I can write out parent.
We write out parent inside of the inner iFrame, we can get a reference to the parent window element
to the parent window object.
So if I write out parent dot a.
Now, I see that value of one again right now, because of our current settings, our child iFrame can
try to access different things inside the parent.
The opposite is true as well.
So inside of my test context, I'm going to do window B equals to.
I'll then go back into my parent context.
Some top again, if I do window B over here, I get undefined because Window B is a sign inside the
child, not the parent.
But if I wanted to somehow reach from the parent into the child, I can write out the following code.
I can do a document.
Where is Selecter?
Or Efraim.
iFrame, not just frame, that's better, so it's going to give me a reference to that iFrame than to
reach into the iFrame I can reference content window like so.
That is going to reach from the parent into the child and get access to that window object, then if
I try to print out the property on it, there's the number two.
So that is an example of reaching from the parent into the child and trying to access some different
properties.
OK, so at this point time, clearly we are able to kind of reach across this context and kind of make
changes or get access to properties between the two.
But this is only because our current settings allow this level of communication.
So let's take another brief pause, come back to the next video.
We're going to take a look at some of the different settings we can change to break this communication
and disallow any communication between the two.