Iframe和父窗口互调方法的集合

时间:2023-03-09 21:42:19
Iframe和父窗口互调方法的集合
1.子iframe里调用父级的方法:window.parent.document.
2.父级里调用子集iframe:window.frames["iframe_text"].document.
下面是例子:
index.html
<HTML>
    <HEAD>
        <TITLE> Test Page </TITLE>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="prototype-1.4.0.js"></script>
        <script language="javascript">
            function show()
            {
                window.frames["iframe_text"].document.getElementById("myH1").innerHTML = "http://hi.wonsoft.cn";
            }
        </script>
    </HEAD>
    <BODY>
        <iframe height="350"  width="600" src="iframe_test.html" name="iframe_text"></iframe>
        <form action="" method="post">
            <input name="haha" id="haha" type="text" maxlength="30" value="haha" />
            <br />
            <textarea cols="50" rows="5" id="getAttributeMethod"></textarea>
            <input type="button" onClick="show();" value="提交"/>
        </form>
        <h1 id="myH1">d</h1>
    </BODY>
</HTML>
iframe_test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
  </head>
  <script language="javascript">
    function show()
    {
      alert(window.parent.document.body.scrollTop);
      window.parent.document.getElementById("myH1").innerHTML = document.getElementById("text").value//wonsoft.cn;
    }
  </script>
  <body>
    <h1 id="myH1">ha</h1>
    <form action="" method="post">
      <input name="abc" id="abc" type="text" maxlength="30" value="abc" />
      <br />
      <textarea cols="50" rows="10" id="text"></textarea>
      <br />
      <input type="button" value="提交" onclick="show();"/>
    </form>
  </body>
</html>