ifame的使用
一、学习使用iframe
1. 在parent.jsp页面中，使用ifame标签将son.jsp引入进来，
2. 并在父页面中访问子页面的对象/方法，在子页面中访问父页面中的对象/方法
|
<html> <head> <title>父页面</title> </head> <body> <input value="调用子页面方法" type="button" onclick="callSonMethod();" /> <input value="parentText" type="text" id="myText" /> <iframe id="iframeContainer" src="son.jsp" width="60%" align="right"></iframe> </body> </html> <script> function callSonMethod() { // 得到子页面的window对象 var sonWindow = document.getElementById("iframeContainer").contentWindow; // 得到子页面的一个对象 var sonText = sonWindow.document.getElementById("myText"); alert(sonText.value); // 调用子页面的方法 sonWindow.callSonMethod(); } function callParentMethod() { alert("父页面中的方法被调用!"); } </script> |
|
<html> <head> <title>子页面</title> </head> <body> <input value="调用父页面方法" type="button" onclick="callParentMethod();" /> <input value="sonText" type="text" id="myText" /> </body> </html> <script> function callParentMethod() { // 得到父页面的window对象 var parentWindow = parent; // 得到父页面的一个对象 var parentText = parentWindow.document.getElementById("myText"); alert(parentText.value); // 调用父页面的方法 parentWindow.callParentMethod(); } function callSonMethod() { alert("子页面中的方法被调用!"); } </script> |
