The iframe element is the document in the document.
window object: The browser will create a corresponding window object when it opens an HTML document. However, if a document defines one or more frameworks (i.e., contains one or more frames or iframe tags), the browser will create a window object for the original document and then create additional window objects for each iframe, which are child windows of the original window.
contentWindow: refers to the window object where the specified iframe or iframe is located
Demo1
Parent page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Parent page</title>
</head>
<body>
<input type=button value="Calling the function childSay function in the child page" onclick="callChild()">
<iframe src=""></iframe>
<script type="text/javascript">
function parentSay() {
alert("I am the method in the parent page");
}
function callChild()
{
("myFrame").();
}
</script>
</body>
</html>
Subpage
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Subpage</title>
</head>
<body>
<input type=button value="Call the parent pageparentSay()function" onclick="callParent()">
<script type="text/javascript">
function childSay()
{
alert("I'm a subpage saying method");
}
function callParent() {
();
}
</script>
</body>
</html>
Demo2
Parent page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Calls between parent and child pages</title>
</head>
<body>
<iframe src="http://localhost/iframe/" ></iframe>
<iframe src="http://localhost/iframe/" ></iframe>
<div class="iframe1">I'm the parent page</div>
<script type="text/javascript">
var iframe2=('iframe2');
=function(){//The parent page calls the method in the child page ();
};
function test2() {
("I am a method in the parent page, called in the child page");
return iframe2;
}
</script>
</body>
</html>
Subpage:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Subpage</title>
</head>
<body>
<div >aaa</div>
<div class="iframe2">Subpage</div>
<script type="text/javascript">
//The child page calls the parent page function: parent.test2();
function b(){
("I am a subpage iframe2");
}
function c() {
("iframe3 page calls iframe2 page");
}
</script>
</body>
</html>
Subpage:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>iframe3</title>
</head>
<body>
<script type="text/javascript">
var iframe2=parent.test2();
();//iframe3 calls the method in iframe2 </script>
</body>
</html>
Demo2 also implements the call between subpages and subpages.
The above is all the content of the mutual calls between the parent page and the child page of Iframe brought to you. I hope everyone supports me~