以下为open函数的使用实例
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>BOM编程之window对象的open函数</title> 10 </head> 11 <body> 12 <script type="text/javascript"> 13 /* 14 1.document是DOM对象，并且是DOM总的顶级根对象（当前网页文档） 15 2.window是BOM对象，并且是BOM中的顶级根对象（当前浏览器窗口） 16 3.window对象有一个open()函数，可以开启新窗口 17 */ 18 function openbaidu(){ 19 window.open("http://www.baidu.com") 20 //open函数的第二个参数是设置目标位置，和超链接的target属性相同 21 /* 22 window.open("http://www.baidu.com","_self");//不产生新页面，在原有页面上跳转 23 window.open("http://www.baidu.com","_blank"); 24 window.open("http://www.baidu.com","_parent"); 25 window.open("http://www.baidu.com","_top"); 26 */ 27 } 28 </script> 29 <input type="button" value="百度" onclick="openbaidu()"> 30 31 </body> 32 </html>
使用close函数需要和open函数配合一起使用，以下代码分别是使用open函数的window窗口和使用close函数的window窗口
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>BOM编程之window对象的close函数</title> 10 </head> 11 <body> 12 <script type="text/javascript"> 13 function openWin(){ 14 window.open("31.BOM编程之window对象的close函数的子窗口.html") 15 } 16 </script> 17 <input type="button" value="打开一个子窗口" onclick="openWin()"> 18 19 </body> 20 </html>
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>BOM编程之window对象的close函数的子窗口</title> 10 </head> 11 <body> 12 <script type="text/javascript"> 13 function closeWin(){ 14 if(window.confirm("确定要关闭吗?")){ 15 window.close(); 16 } 17 } 18 </script> 19 <input type="button" value="关闭子窗口" onclick="closeWin()"> 20 21 </body> 22 </html>
opener函数用于调用父窗口的内容
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>BOM编程之window对象的opener属性</title> 10 </head> 11 <body> 12 <script type="text/javascript"> 13 var username="zhangsan" 14 function sayHello(){ 15 alert("hello world") 16 } 17 alert(username) 18 //等同于window.alert(username) 19 sayHello() 20 //等同于window.sayHello() 21 function openchildwin(){ 22 window.open("32.BOM编程之window对象的opener属性的子窗口.html") 23 } 24 </script> 25 <input type="button" value="打开子窗口" onclick="openchildwin()"> 26 27 </body> 28 </html>
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>BOM编程之window对象的opener属性的子窗口</title> 10 </head> 11 <body> 12 <script type="text/javascript"> 13 function openparentwin(){ 14 var win32=window.opener//win32指的是32那个窗口的window，所以那个窗口可以访问什么win32就可以访问什么，可以实现父子通讯 15 alert(win32.username) 16 //var win32=window.opener 17 //win32.sayHello() 18 } 19 </script> 20 <input type="button" value="访问父窗口内容" onclick="openparentwin()"/> 21 22 </body> 23 </html>