今天学习了如何使用javascript打开关闭，更新和定位窗口，如何使用javascript将信息写入窗口，从而可以在运行时构建网页。
(一)打开新窗口
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>open a window</title>
<script type="text/javascript" src="script01.js"></script>
</head>
<body bgcolor="#ffffff">
<h1>the master of the house</h1>
<h2>click on his name to behold he who must be adored</h2>
<h2><a href="http://www.php1.cn/"> </body>
</html>
(二)打开多个窗口
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>about that cat</title>
<script type="text/javascript" src="script02.js"></script>
</head>
<body bgcolor="#ffffff">
<h1>more pictures of our cat</h1>
<h2><a href="http://www.php1.cn/"> </body>
</html>
(三)关闭窗口
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>window test</title>
<script type="text/javascript" src="script03.js"></script>
</head>
<body bgcolor="#ffffff">
<div align="center">
<h1>let's play with windows!</h1>
<h3>
<a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> </h3>
</div>
</body>
</html>
(四)把窗口放在指定位置
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>window test</title>
<script type="text/javascript" src="script06.js"></script>
</head>
<body bgcolor="#ffffff">
<div align="center">
<h1>let's play with windows!</h1>
<h3>
<a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> <a href="http://www.php1.cn/"> </h3>
</div>
</body>
</html>
以上四种操作所需的js脚本分别为以下scripti：
[javascript]
/**
* 打开新窗口(script1.js)
*/
window.onload=newwinlinks;
function newwinlinks(){
for(var i=0;i<document.links.length;i++){
if(document.links[i].classname=="newwin"){
document.links[i].onclick=newwindow;
}
}
}
function newwindow(){
var catwindow=window.open("images/pixel1.jpg", "catwin", "resizable=no,width=350,height=260");
//注意在宽度和高度参数中的逗号之间不能有任何空格，如果有空格，那么脚本
//可能在某些浏览器中无效，
return false;
}
[javascript]
<pre class="javascript" name="code">/**
*打开多个窗口(script2.js) 在每次点击屏幕上的一个控件时，通过创建的脚本代开不同的窗口
*/
window.onload=newwinlinks;
function newwinlinks(){
for(var i=0;i<document.links.length;i++){
if(document.links[i].classname="newwin"){
document.links[i].onclick=newwindows;
}
}
}
function newwindows(){
for(var i=1;i<5;i++){
var imgname="images/pixel"+i+".jpg";
var winname="window"+i;
var catwindow=window.open(imgname, winname,"width=350,height=260");
}
}
[javascript]
/**
* 关闭窗口(script3.js)
*/
var newwindow=null;
window.onload=newwinlinks;
function newwinlinks(){
for(var i=0;i<document.links.length;i++){
document.links[i].onclick=chgwindowstate;
}
}
function windowopen(){
if(newwindow&&!newwindow.closed){
return true;
}
return false;
}
function chgwindowstate(){
if(this.id=="closewin"){
if(windowopen()){
newwindow.close();
}else{
alert("the window isn't open");
}
}
if(this.id=="openwin"){
if(windowopen()){
alert("the window is already open!");
}else{
newwindow=window.open("", "newwin","toolbar,location=yes,width=300,height=200");
}
}
return false;
}
[javascript]
/**
* 把窗口放在指定的位置(script4.js)有时候希望在屏幕上的指定位置打开一个窗口，在这个示例中，用户可以选择在屏幕的四个角之一打开一个小窗口。
*/
var newwindow=null;
window.onload=newwinlinks;
function newwinlinks(){
for(var i=0;i<documeng.links.length;i++){
document.links[i].onclick=chgwindowstate;
}
}
function windowopen(){
if(newwindow&&!newwindow.closed){
return true;
}
return false;
}
function chgwindowstate(){
if(this.id=="closewin"){
if(windowopen()){
newwindow.close();
}else{
alert("the window isn't open");
}
return false;
}
var toppos=0;
var leftpos=0;
if(this.id.indexof("bottom")>-1){
toppos=screen.availheight-200;
}
if(this.id.indexof(right)>-1){
leftpos=screen.availwidth-300;
}
if(windowopen()){
newwindow.moveto(leftpos,toppos);
}else{
newwindow=window.open(,newwin,toolbar,location=yes,width=300,height=200,left=+leftpos+,top=+toppos);
}
return false;
}
opener和parent比较：
window.opener其实是指本窗口的父窗口，比如，parwin.js通过window.open弹出了childwin.jsp,那么在childwin.js里面的window.opener就是指parwin.jsp，所以在childwin.js里面完全可以用window.opener调用任何一个parwin.jsp里面的方法，实现parwin.jsp和childwin.jsp的交互。
window.parent 是iframe页面调用父页面对象，比如一个parwin页面利用iframe或frame调用childwin页面，那么parwin页面所在窗口就是childwin页面的parent。