October 6, 2000 - Replacing a Frame's Content | WebReference

October 6, 2000 - Replacing a Frame's Content

Yehuda Shiran October 6, 2000
Replacing a Frame's Content
Tips: October 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

In Internet Explorer 5.5 and up, you can retrieve the FRAME or IFRAME object that is hosting the current window. You find it by window.frameElement. Once you have the frame object, you can do a lot of stuff. For example, you can load a new document into the frame. The following script does just that:

var oFrame = window.frameElement;
oFrame.src = "http://www.webreference.com/js"; 

Let's take an example. The following three documents represent a frameset of two frames. You can switch the content of the left frame by clicking the Switch button. Here is the frameset:

<HTML>
<HEAD>
<TITLE>Set</TITLE>
</HEAD>
<FRAMESET COLS="50, 50 FRAMEBORDER="no" FRAMESPACING="1"> 
  <FRAME SRC="001006c.html" NAME="left">
  <FRAME SRC="001006b.html" NAME="right">
</FRAMESET>
</HTML>

Here is the left frame:

<HTML>
<HEAD>
<TITLE>Frame A</TITLE>
</HEAD>
<BODY>
Frame A
<INPUT TYPE="button" onclick="dothis()" value="Switch">
<SCRIPT LANGUAGE="JScript">
function dothis() {
    var oFrame = window.frameElement;
    oFrame.src = "http://www.webreference.com/js";
}
</SCRIPT>
</BODY>
</HTML>

And finally, the right frame:

<HTML>
<HEAD>
<TITLE>Frame B</TITLE>
</HEAD>
<BODY>
Frame B
</BODY>
</HTML>

Go ahead and play with it. Learn more about frames in Column 36, JavaScript and Frames, Part I, and Column 37, JavaScript and Frames, part II.