window的frame操作方式
?
1：name和id得到frame对象的区别
? ?name属性得到的是frame框架里的页面的WINDOW对象，
? ?id属性得到的即是frame标签。
?
例：我们可以用name属性得到frame所连接页面的WINDOW对象
? ? var iframeWindow = window.frames[index或frameName];
? ? 或
? ? var iframeWindow = window.frameName; ?
这两种方式IE、FireFox都支持！
但是iframeWindow这个对象无法得到frame标签的attribute，例如：我们想找到frame标签的src属性的值，通过下面的方式，是错误的！
? ? alert(iframeWindow.src); //这是得不到的
在这个时候，我们只能通过id属性去得到frame标签对象。
? ? alert(document.getElementById("frameName").src); //这是正确的
?
2：父级、子级之间的数据、方法调用。
在父级窗口，我们可以用iframeWindow直接去访问子页面的method和attribute。
例：
? ? alert(iframeWindow.document.getElementById("df").innerHTML);
? ? alert(iframeWindow.childAlter()); ?
在子级窗口，我们可以用parent直接去访问 父页面的method和attribute。
例：
? ? alert(parent.parentAlert());
?
3：完整的例子如下：
Parent页面：index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
? ? <title>My JSP 'index.jsp' starting page</title>
? ? <script type="text/javascript">
? ? function changeSrc()
? ? {
? ? ? ?//-------window.frames[]方法得到子页面window对象--------
? ? ? ?var iframeWindow = window.frames[0];
? ? ? ? //= window.frames["myframe"];
?
? ? ? ? //-------window.frameName方法得到子页面window对象-------
? ? ? ?var iframeWindow = window.myframe;
?
? ? ? ? //--------访问子页面对象、方法-------------
? ? ? ? alert(iframeWindow.document.getElementById("df").innerHTML);
? ? ? ? iframeWindow.childAlert(); ? ??
?
? ? ? ?//-------window.document.getElementById()得到标签对象---
? ? ? ?var iframeWindow = window.document.getElementById("myframe");
? ? ? ?alert(iframeWindow.src);
? ? }
?
? ? function parentAlert()
? ? {
? ? ? ? alert("i'm parent!");
? ? }
? ? </script>
</head>
?
<body>
? ? 下面是iframe
? ? <iframe id="myframe" name="myframe" src="child.jsp" frameborder="0"></iframe>
? ? <br />
? ? <input type="button" value="连接页面" onclick="javascript:changeSrc();" />
</body>
</html>
?
Child页面：child.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
? <head>
? ? <title>My JSP 'child.jsp' starting page</title>?
? ? ? ?<script type="text/javascript" >
? ? ? ? ? ?function childAlert()
? ? ? ? ? ?{
? ? ? ? ? ? ? alert("i'm children");
? ? ? ? ? ? ? parent.parentAlert();//父页面方法
? ? ? ? ? ?} ? ? ? ??
? ? ? ?</script>
? ? </head>
?
? <body>
? ? <div id="df">Wo shi childDIV. </div> ? ? ?
? </body>
</html>
