JS operation dom in iframe (example explanation)

Directly assigning the following code to understand:

Copy the codeThe code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Unt titled document</title>
</head>

<body>
<div class="line">==================================================================</div>
<p > Used to test that child form iframeA accesses an element of the parent form</p>
<div class="line">=============================================================</div>
<iframe src="" width="100%" frameborder="0" name="frameA"></iframe>
<iframe src="" name="iframeB" width="100%" frameborder="0" ></iframe>
<div class="line">=============================================================</div>
<p>Let's demonstrate first: Parent form accesses a method or element in a child form</p>
<p>Summary: The parent form uses different methods to access child forms and elements</p>
<input type="button" onclick="frameDiv()" value="Parent form accesses an element in the child form" />
<input type="button" onclick="frameFun()" value="Parent form accesses a method in the child form" />
<script type="text/javascript">
//How to access parent window in child window
    function testP(ss){
        alert(ss)
    }
//Get the element of the iframe
    function getIframe(id){
        return (id).;
    }
// Parent window accesses child window elements
    function frameDiv(){
        getIframe("frameA").getElementById("ooxx").="#f00"
//["iframeA"].getElementById("ooxx").="#f00" //A certain element cannot be accessed in this form
    }
//How to access child window in parent window
    function frameFun(){
//getIframe("frameB").getsFun();//A method of the child form cannot be accessed in this form
       // ["iframeB"].getsFun();
alert(["iframeB"].getsFun());
    }
</script>
</body>
</html>

Copy the codeThe code is as follows:

<body>
<div > Used to test the parent form to access an element in the child form</div>
<p>Used to test sub-window B accesses an element of form A</p>
<p>1. The child window iframeA accesses an element of the parent window</p>
<input type="button" onclick="frameToPdiv()" value="Sub window accesses an element of the parent window" />
<input type="button" onclick="frameToPfun()" value="Sub window accesses a certain method for a parent window" />
<script type="text/javascript">
//The child window accesses an element of the parent window
    function frameToPdiv(){
        ("pox").="#fff";
        ("pox").="#f0a0f0"
    }
//How to access parent window in child window
    function frameToPfun(ss){
        ("ssss");
    }
//Methods used to test iframeB access
    function testBA(){
alert("Method for testing iframeB access")
    }
</script>
</body>
</html>

Copy the codeThe code is as follows:

<body>
<p>2: Test the mutual access of a method or element between subforms</p>
<input type="button" value="Subform B accesses an element of child form A" onclick="frameTframeDiv()" />
<input type="button" value="Subform B accesses child form A" onclick="frameTframeFun()" />
<script type="text/javascript">
//Subform B accesses an element of child form A
    function frameTframeDiv(){
        //("frameA").("divooxx").="#a0c0f0";
        //("frameA").("divooxx").="#000"
var _bframe=("frameA");//How to access parent form for child form
        _bframe.getElementById("divooxx").="#a0c0f0";
        _bframe.getElementById("divooxx").="#000";
    }
//Subform B accesses subform A certain method
    function frameTframeFun(){
            ["frameA"].testBA();
    }
</script>
<script type="text/javascript">
    function getsFun(){
        return "sssssss";
    }
    //getFun()
</script>
</body>
</html>