---------------------------------------The following is the first HTML
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title></title>
<body>
<ul></ul>
<textarea></textarea>
<input type= "button" value= "Send Message to W2"/>
<input type= "button" value= "Send Message to W3"/>
<input type= "button" value= "Open W3"/>
<input type= "button" value= "Close W3"/>
<iframe src= "w2.html" style= "width:500px;height:400px;" ></iframe>
</body>
<script>
var input=document.getelementsbytagname ("input");
var ul=window.document.getelementsbytagname ("ul") [0];
var text=window.document.getelementsbytagname ("textarea") [0];
var iframe=window.document.getelementsbytagname ("iframe") [0];
var W3;
Input[2].onclick=function () {
W3=window.open (' w3.html ', "W3window", "width=300,height=300");
};
Input[3].onclick=function () {
if (w3==undefined)
{
Alert ("Does not exist w3!");
}
Else
{
if (w3.closed) {
Alert ("W3 has been closed");
}
else{
W3.close ();
}
}
};
Input[1].onclick=function () {
if (w3!=null&&!w3.closed) {
var linode=w3.document.createelement ("Li");//Put in memory
var ul3=w3.document.getelementsbytagname ("ul") [0];//get W3 page under the first UL
var Val=text.value;
Linode.innerhtml=val;
Ul3.appendchild (LiNode);
W3.focus ();
}
Else
{
Alert ("Please open w3! ");
}
};
input[0].onclick= function () {
var winp=iframe.contentwindow;//find the window through the Contentwindow property of the IFRAME
if (WINP) {
var Val=text.value;
var li=winp.document.createelement ("Li");
Li.innerhtml=val;
var ul=winp.document.getelementsbytagname ("ul") [0];
Ul.appendchild (LI);
}
}
</script>
---------------------------------------below is the second page
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title></title>
<body>
<ul></ul>
<textarea></textarea>
<input type= "button" value= "Send message to W1"/>
</body>
<script>
var text=document.getelementsbytagname ("textarea") [0];
var input=document.getelementsbytagname ("input") [0];
input.onclick= function () {
var winp=window.parent;//to find the parent window of the window through the Parent property
if (WINP) {
var li=winp.document.createelement ("Li");
var Val=text.value;
Li.innerhtml=val;
var ul=winp.document.getelementsbytagname ("ul") [0];
Ul.appendchild (LI);
}
}
</script>
-----------------------------------------the third page below
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title></title>
<body>
<ul></ul>
<textarea></textarea>
<input type= "button" value= "Send message to W1"/>
</body>
<script>
var text3=window.document.getelementsbytagname ("textarea") [0];
var input=window.document.getelementsbytagname ("input") [0];
Input.onclick=function () {
var openerwindow=window.opener;//looking for a window to open this window
if (Openerwindow)
{
var li=openerwindow.document.createelement ("Li");
var ul=openerwindow.document.getelementsbytagname ("ul") [0];
var Val=text3.value;
Li.innerhtml=val;
Ul.appendchild (LI);
}
}
</script>
The understanding of BOM--the relationship between various windows