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

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
Google Chrome Playing Catch-Up on Extensions
Open Solutions Alliance Gets New Leadership
Red Hat Spacewalk Expands Linux Management
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.


People who read this tip also read these tips:

Look for similar tips by subject:

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

webref The latest from WebReference.com Browse >
Popular JavaScript Framework Libraries: An Overview - Part 3 · Accessing Your MySQL Database from the Web with PHP · Working with the DOM Stylesheets Collection
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
MS Access and MySQL · Cisco AutoQoS: VoIP QoS for Mere Mortals · While VoIP Adoption Explodes in Enterprise, Carrier Spending Lags