Javascript 之 Windows对象

最新推荐文章于 2024-08-22 23:42:23 发布

码海拾贝2023

最新推荐文章于 2024-08-22 23:42:23 发布

阅读量4.2k

点赞数 1

本文链接：https://blog.csdn.net/bemavery/article/details/17272735

版权

Javascript之 Windows对象

所有浏览器都支持window 对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为window 对象的成员。也就是说全局变量是 window 对象的属性。全局函数是window 对象的方法。甚至 HTML DOM 的document 也是 window 对象的属性之一,如下：

window.document.getElementById("header");

与此相同：

document.getElementById("header");

下面来介绍一些windows对象常用的一些方法函数

1.打开新窗口：window.open函数

比如：

打开网页，并且控制网页大小、尺寸

window.open("http://www.baidu.com","width=800,height=500,resizable=no");

普通方法打开网页

window.open("http://www.baidu.com");

<html>
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
	<title></title>
		<script language="JavaScript">
			function fun(url){
				window.open(url,"页面标题","width=500,height=500");
			}
		</script>
    </head>
    <body >
		<form action="" method="post">
			<select name="favor" onChange="fun(this.value)">
				<option value="#">====请选择====</option>
				<option value="http://www.baidu.com">百度</option>
				<option value="http://www.google.com">谷歌</option>
			</select>
		</form>
    </body>
</html>

效果如图

2.确认窗口:window.confirm()

比如：var flag = window.confirm("确认？"); 如果选是，则返回true；否则返回false；

<html>
	<head>
		<title></title>
		<script language="JavaScript">
			(function fun(){
				if(window.confirm("确认")){
					alert("是");
				}
				else{
					alert("否");
				}
			})()
			//fun();
		</script>	
	</head>
	<body >	
	</body>
</html>

点击确认以后的效果图如下

3.页面重定向

通过window.location属性能够完成页面的转换；

只需要window.location="http://www.google.com"就能够将当前网页跳转到谷歌;

<html>
	<head>
		<title></title>
		<script language="JavaScript">
			function fun(url){
				window.location=url;   //将当前的网页的地址变换
			}
		</script>
		
	</head>
	<body >
		<form action="" method="post">
			<select name="favor" onChange="fun(this.value)">
				<option value="#">====请选择====</option>
				<option value="http://www.baidu.com">百度</option>
				<option value="http://www.google.com">谷歌</option>
			</select>
		</form>
	</body>
</html>

页面重定向是在当前网页跳转,不同于open方法

4.在子窗口中操作父窗口 opener

通过window.opener.document可以获得父窗口的文档对象；

window.opener.location可以获得父窗口地址；

window.opener.location.reload();重新加载父窗口；

<!--父窗口：-->
<html>
	<head>
		<title></title>
		<script language="JavaScript">
			function fun(){
				window.open("two.html","页面标题","width=800,height=500,resizable=no");
			}
		</script>
		
	</head>
	<body >
		<form action="" method="post">
			<input type="button" value="打开子窗口" onClick="fun()"/>
		</form>
	</body>
</html>
<!--子窗口:-->
<html>
	<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   
		<title></title>
		<script language="JavaScript">
		function fun(){
			window.opener.location="http://www.baidu.com";
		}
		</script>
	</head>
	<body >
		<input type="button" value="跳转到百度" onClick="fun()"/>
	</body>
</html>

第一次点击打开子窗体